Skip to content
This repository

Pure js cross-browser WYSIWYM editor with a focus on the clean separation of content and styling.

Octocat-spinner-32 _layouts Jekyll the thing! October 31, 2013
Octocat-spinner-32 chef Support WYMeditor development via Vagrant. August 22, 2013
Octocat-spinner-32 dist And again, don't forget the dist. March 25, 2014
Octocat-spinner-32 docs Notes and ideas around future parser improvement. April 14, 2014
Octocat-spinner-32 src I hope this is the desired test. March 26, 2014
Octocat-spinner-32 website-media Pull in the github pages template static assets. October 31, 2013
Octocat-spinner-32 wym_selenium Refs #360. Added a selenium test showing that this ticket fixed issue #… July 29, 2013
Octocat-spinner-32 .bowerrc Let's try out bower for dependency management. August 27, 2013
Octocat-spinner-32 .gitignore Git: do not track built documentation. March 12, 2014
Octocat-spinner-32 .jshintignore Let's ignore opera. It's time to drop it, anyway. September 26, 2013
Octocat-spinner-32 .jshintrc JSHint should enforce compatibility with IE7 via the es3 option. September 25, 2013
Octocat-spinner-32 .travis.yml Run jshint on travis September 26, 2013
Octocat-spinner-32 AUTHORS Added Matt Travi to AUTHORS. Thanks Matt! January 07, 2014
Octocat-spinner-32 CHANGELOG.md Better changelog entry. March 26, 2014
Octocat-spinner-32 GPL-license.txt Moved licenses and README to please GitHub October 25, 2010
Octocat-spinner-32 Gemfile Jekyll the thing! October 31, 2013
Octocat-spinner-32 Gemfile.lock Jekyll the thing! October 31, 2013
Octocat-spinner-32 Gruntfile.js Refs #474. Automate/document installation of components via bower March 11, 2014
Octocat-spinner-32 MIT-license.txt Moved licenses and README to please GitHub October 25, 2010
Octocat-spinner-32 Makefile Refs #427. Removed the building code from the Makefile. August 06, 2013
Octocat-spinner-32 README.md Update all references to use new hosted examples location. November 01, 2013
Octocat-spinner-32 Vagrantfile Support livereload access from outside the vagrant box. August 27, 2013
Octocat-spinner-32 _config.yml Jekyll the thing! October 31, 2013
Octocat-spinner-32 bower.json Refs #477. Pegged bower-installed jquery to 1.4.4. March 12, 2014
Octocat-spinner-32 index.html Port over the current project page content. October 31, 2013
Octocat-spinner-32 package.json Merge branch 'master' of github.com:wymeditor/wymeditor March 11, 2014
Octocat-spinner-32 pre-release_checklist.md Remind yourself to update the project site as part of the release. October 31, 2013
Octocat-spinner-32 vagrant_provision.sh Refs #474. Automate/document installation of components via bower March 11, 2014
README.md

WYMeditor Build Status

WYMeditor is an open source web-based WYSIWYM editor with semantics and standards in mind. The WYM-part stands for "What You Mean" compared to the more common "What You See Is What You Get".

Why WYMeditor?

WYMeditor is different from the traditional editors because we are 100% focused on providing a simple experience for users that separates the content of their document from the presentation of that document. We focus on enforcing web standards and separating a document's structure (HTML) from its presentation (CSS). Your users won't know and shouldn't care about HTML, but when they need consistent, standards-compliant, clean content, they'll thank you.

There are lots of choices when it comes to a browser-based editor and many of them are stable, mature projects with thousands of users. If you need an editor that gives total control and flexibility to the user (not you, the developer), then WYMeditor is probably not for you. If you want an editor that you can customize to provide the specific capabilities your users need, and you want users focused on the structure of their content instead of tweaking fonts and margins, you should give WYMeditor a try.

Try It

Want to see what WYMeditor can do? Try the WYMeditor examples right now.

These examples run the bleeding edge code and give you a good idea of what WYMeditor can do.

Quick Start

  1. WYMeditor requires a version of jQuery between 1.3.0 and 1.9.1. First ensure that your page includes jQuery.

    Note: If a version of jQuery at or above 1.8.0 is used, WYMeditor also requires jQuery Migrate. Ensure that your page also includes jQuery Migrate after jQuery is included.

  2. Download the Version 1.0.0b5 archive from the release page and extract the contents to a folder in your project.

  3. Include the wymeditor/jquery.wymeditor.min.js file on your page using this script. This file will pull in anything else that's required.

    <script type="text/javascript" src="/wymeditor/jquery.wymeditor.min.js"></script>
    
  4. Now use the wymeditor() function to select one of your textarea elements and turn it in to a WYMeditor instance. eg. if you have a textarea with the class my-wymeditor:

    $('.my-wymeditor').wymeditor();
    

    Note: You'll probably want to do this initialization inside a $(document).ready() block.

  5. If you'd like to receive the valid XHTML your editor produces on form submission, just add the class wymupdate to your submit button.

    <input type="submit" class="wymupdate" />
    
  6. ???

  7. Profit!

More examples with different plugins and configuration options can be found in your examples directory.

Compatibility

WYMeditor is compatible with:

Browsers

  • IE: 7, 8, 9 and 10
  • Firefox: LTS and latests two major versions
  • Opera: Latest version
  • Safari: Latest version
  • Google Chrome: Latest two major versions

jQuery

  • Versions 1.3.X to 1.7.X
  • Version 1.8.x to 1.9.X when you include jquery-migrate

Contributing to WYMeditor

Documentation

Our documentation uses the Sphinx documentation tool. The source lives in the docs/ folder and every pull requests that isn't just fixing a bug must come with documentation.

You can see the current documentation at wymeditor.readthedocs.org.

Testing WYMeditor

To maintain quality, WYMeditor includes both a Qunit unit test suite and a Selenium2 test suite. You are encouraged to run both of them, with all tests passing in all supported browsers. If that's ever not the case, please file a bug so we can fix it!

All of the following instructions assume you've already retrieved a copy of the source, using git like so:

git clone git://github.com/wymeditor/wymeditor.git

Unit Tests vs Selenium Tests

The unit test suite covers the vast majority of required tests and can be quickly run by anyone with a copy of the source code either from the command line or in a browser. For the majority of behavior, a unit test will suffice. Unfortunately, there are cases where browser behavior can't be simulated in a unit test (these primarily involve testing browser-specific input handling and execCommand behavior). To test these issues, a Selenium test is required.

Currently, the Selenium test suite is written in python. In the future, we would like to move to the node.js wd module. This will once again allow a contributor to only require knowledge of javascript in order to enhance WYMeditor.

Running Unit Tests

Read the documentation on Testing WYMeditor.

Selenium Tests

Because WYMeditor is strongly affected by the way various browsers handle certain native events (keystrokes, mouse navigation, switching windows), it's not always possible to use JavaScript to actually test that behavior. For specific cases where it's not possible to reproduce a behavior in JavaScript, we rely on our Selenium2 test suite to drive an actual browser using the Selenium 2 python bindings.

If possible, it is strongly encouraged to write a JavaScript unit test using Qunit instead of a Selenium test.

Running Selenium Tests
  1. Install the Selenium 2 python bindings, roughly following these installation instructions. The specific version of the python Selenium bindings and the nose testing framework we require are defined in a pip requirements file located at wym_selenium/requirements.txt. To install these, we recommend that you first create an isolated python virtualenv:

    $ mkdir -p ~/.virtualenvs
    $ virtualenv ~/.virtualenvs/wym
    
  2. Then use pip to install the requirements:

    (wym)$ cd /path/to/wymeditor
    (wym)$ pip install -r selenium_requirements.txt
    
  3. To run the Selenium tests, you'll first need to serve the src directory with a web server. If you have python installed, then you can simply open a terminal and run:

    $ cd /path/to/wymeditor
    $ make testserver
    

    You'll need to keep this terminal open when running the tests.

  4. Then you can use make once again (in another terminal) to actually run the tests:

    $ source ~/.virtualenvs/wym/bin/activate
    (wym)$ cd /path/to/wymeditor
    (wym)$ make selenium
    

Building WYMeditor

Read about Building WYMeditor

Getting Help

Read more on contributing

Copyright

Copyright (c) 2005 - 2013 Jean-Francois Hovinne, Dual licensed under the MIT (MIT-license.txt) and GPL (GPL-license.txt) licenses.

Something went wrong with that request. Please try again.