kuji-mercury-rails 0.3.2

data/features/loading/loading.feature

@@ -0,0 +1,22 @@
+@javascript
+Feature:
+  As a content editor type person
+  In order to manage content
+  I should be able to expect the editor to load properly
+
+  Background:
+    Given I am on an editable page
+
+
+  Scenario: A user can expect to see the toolbar
+    Then I should see "Save" within the toolbar
+    And I should see "Preview" within the toolbar
+    And I should see "Bold" within the toolbar
+
+
+  Scenario: A user can expect to see the contents of the iframe
+    Then I should see "Editable region" in the content frame
+
+
+  Scenario: A user can expect to see the status bar
+    Then I should see "Mercury Editor v0.3.1" within the statusbar

data/features/loading/navigating.feature

@@ -0,0 +1,77 @@
+@javascript
+Feature:
+  As a content editor type person
+  In order to manage content
+  I should be able to expect the editor to not get in the way when I navigate and submit forms
+
+  Background:
+    Given I adjust the configuration to have: {"nonHijackableClasses": ["lightview"]}
+    And am on an editable page
+
+
+  Scenario: A user can navigate links targeting _top
+    When I follow "_top" in the content frame
+    Then I should be on the test page
+
+
+  Scenario: A user can navigate links targeting _blank
+    When I follow "_blank" in the content frame
+    Then I should be on the editable page
+    And I should see "test_page" in the "/mercury/test_page" window
+
+
+  Scenario: A user can navigate links targeting _self
+    When I follow "_self" in the content frame
+    Then I should be on the test page
+
+
+  Scenario: A user can navigate links with no target set
+    When I follow "[none]" in the content frame
+    Then I should be on the test page
+
+
+  Scenario: A user can navigate links that are ignored by configuration
+    When I follow "_self .lightview" in the content frame
+    Then I should be on the editable page
+
+
+  Scenario: A user can navigate links targeting random windows
+    When I follow "foo" in the content frame
+    Then I should be on the editable page
+    Then I should see "test_page" in the "foo" window
+
+
+  Scenario: A user can submit forms targeting _top
+    When I press "post _top" in the content frame
+    Then I should be on the test page
+    And I should see "post _top"
+
+
+  # todo: intermittent failure
+#  Scenario: A user can submit forms targeting _blank
+#    When I press "post _blank" in the content frame
+#    Then I should be on the editable page
+#    And I should see "post _blank" in the "/mercury/test_page" window
+
+
+  Scenario: A user can submit forms targeting _self
+    When I press "post _self" in the content frame
+    Then I should be on the test page
+    And I should see "post _self"
+
+
+  Scenario: A user can submit forms with no target set
+    When I press "get [none]" in the content frame
+    Then I should be on the test page
+    And I should see "get [none]"
+
+
+  Scenario: A user can submit forms that are ignored by configuration
+    When I press "post _self .lightview" in the content frame
+    Then I should be on the editable page
+
+
+  Scenario: A user can submit forms targeting random windows
+    When I press "get foo" in the content frame
+    Then I should be on the editable page
+    And I should see "get foo" in the "foo" window

data/features/loading/user_interface.feature

@@ -0,0 +1,67 @@
+@javascript
+Feature:
+  As a content editor type person
+  In order to manage content
+  I should be able to interact with various user interface aspects of the editor
+
+  Background:
+    Given I am on an editable page
+
+  Scenario: A user can expect all this!
+
+
+#  Scenario: A user can view and close the about dialog
+    When I click on the about the editor link
+    Then I should see "Mercury Editor" within the lightview title
+    And I should see "Mercury Editor is an open source HTML5 WYSIWYG editor written in Coffeescript using jQuery. The project has been released under the MIT license." within the lightview window
+    And I should see "Project Home" within the lightview window
+    And I should see "Project Source" within the lightview window
+
+    When I click on the lightview overlay
+    Then the lightview window should not be visible
+    And the lightview overlay should not be visible
+
+
+#  Scenario: A user can open and close select dropdowns
+    When I click on the formatblock editor dropdown
+    Then the formatblock select should be visible
+    And I should see "Heading 1 <h1>" within the formatblock select
+
+    When I click on the style editor dropdown
+    Then the style select should be visible
+    And the formatblock select should not be visible
+
+
+#  Scenario: A user can open and close palette dialogs
+    When I click on the background color editor button
+    Then the background color palette should be visible
+
+    When I click on the foreground color editor button
+    Then the foreground color palette should be visible
+    And the background color palette should not be visible
+
+
+#  Scenario: A user can open and close a panel
+    When I click on the "View History" button
+    Then the history panel should be visible
+    And I should see "Page Version History" within the history panel
+
+    When I click on the "View History" button
+    Then the history panel should not be visible
+
+
+#  Scenario: A user can open and close a modal window
+    When I click on the "Insert Link" button
+    Then the modal window should be visible
+    And the modal overlay should be visible
+    And I should see "Insert Link" within the modal title
+    And I should see "Standard Links" within the insert link modal
+
+    When I click on the modal close button
+    Then the modal window should not be visible
+    And the modal overlay should not be visible
+
+    When I click on the "Insert Link" button
+    And click on the modal overlay
+    Then the modal window should not be visible
+    And the modal overlay should not be visible

data/features/regions/editable/basic_editing.feature

@@ -0,0 +1,195 @@
+@javascript
+Feature:
+  As a content editor type person
+  In order to manage content
+  I should be able to manipulate it in various ways (eg. bold, add italics, set headers, colors, etc.)
+
+  Background:
+    Given I am on an editable page
+    And the editor won't prompt when leaving the page
+
+  Scenario: A user can expect all this!
+
+
+#  Scenario: A user can set and unset bold content
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the bold editor button
+    Then the contents of the editable region should be "this is <b><span>simple</span></b> <b>content</b>"
+
+    When I click on the bold editor button
+    Then the contents of the editable region should be "this is <span>simple</span> <b>content</b>"
+
+
+#  Scenario: A user can italicize content
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the italicize editor button
+    Then the contents of the editable region should be "this is <i><span>simple</span></i> <b>content</b>"
+
+    When I click on the italicize editor button
+    Then the contents of the editable region should be "this is <span>simple</span> <b>content</b>"
+
+
+#  Scenario: A user can overline content
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the overline editor button
+    Then the contents of the editable region should be "this is <span style='text-decoration:overline'><span>simple</span></span> <b>content</b>"
+    # doesn't remove overlines
+
+
+#  Scenario: A user can strikeout content
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the strikethrough editor button
+    Then the contents of the editable region should be "this is <strike><span>simple</span></strike> <b>content</b>"
+
+    When I click on the strikethrough editor button
+    Then the contents of the editable region should be "this is <span>simple</span> <b>content</b>"
+
+#  Scenario: A user can underline content
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the underline editor button
+    Then the contents of the editable region should be "this is <u><span>simple</span></u> <b>content</b>"
+
+    When I click on the underline editor button
+    Then the contents of the editable region should be "this is <span>simple</span> <b>content</b>"
+
+
+#  Scenario: A user can make content superscript
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the superscript editor button
+    Then the contents of the editable region should be "this is <sup><span>simple</span></sup> <b>content</b>"
+
+    When I click on the superscript editor button
+    Then the contents of the editable region should be "this is <span>simple</span> <b>content</b>"
+
+
+#  Scenario: A user can make content subscript
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the subscript editor button
+    Then the contents of the editable region should be "this is <sub><span>simple</span></sub> <b>content</b>"
+
+    When I click on the subscript editor button
+    Then the contents of the editable region should be "this is <span>simple</span> <b>content</b>"
+
+
+#  Scenario: A user can justify content to the left, center, right, or fully justified
+    # firefox: this isn't possible on the first line due to a bug in gecko, so we have special content for it
+    Given the content of the editable region has justifiable content
+    And I make a selection
+
+    When I click on the justify left editor button
+    Then the contents of the editable region should be "<div>first line</div><br><div align='left'>this is <span>justifiable</span><b>content</b></div> "
+
+    When I click on the justify center editor button
+    Then the contents of the editable region should be "<div>first line</div><br><div align='center'>this is <span>justifiable</span><b>content</b></div> "
+
+    When I click on the justify right editor button
+    Then the contents of the editable region should be "<div>first line</div><br><div align='right'>this is <span>justifiable</span><b>content</b></div> "
+
+    When I click on the full justification editor button
+    Then the contents of the editable region should be "<div>first line</div><br><div align='justify'>this is <span>justifiable</span><b>content</b></div> "
+
+
+#  Scenario: A user can make an unordered list
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the insert unordered list editor button
+    Then the contents of the editable region should be "<ul><li>this is <span>simple</span> <b>content</b></li></ul>"
+
+    # todo: we should test enter and tab, and shift+tab in advanced editing
+
+#  Scenario: A user can make an ordered list
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the insert ordered list editor button
+    Then the contents of the editable region should be "<ol><li>this is <span>simple</span> <b>content</b></li></ol>"
+
+    # todo: we should test enter and tab, and shift+tab in advanced editing
+
+
+#  Scenario: A user can indent and outdent content
+    # firefox: this isn't possible on the first line due to a bug in gecko, so we have special content for it
+    Given the content of the editable region has justifiable content
+    And I make a selection
+
+    When I click on the indent editor button
+    Then the contents of the editable region should be "<div>first line</div><br><blockquote>this is <span>justifiable</span><b>content</b></blockquote> "
+
+    When I click on the indent editor button
+    Then the contents of the editable region should be "<div>first line</div><br><blockquote><blockquote>this is <span>justifiable</span><b>content</b></blockquote></blockquote> "
+
+    When I click on the outdent editor button
+    Then the contents of the editable region should be "<div>first line</div><br><blockquote>this is <span>justifiable</span><b>content</b></blockquote> "
+
+    When I click on the outdent editor button
+    Then the contents of the editable region should be "<div>first line</div><br>this is <span>justifiable</span><b>content</b> "
+
+
+#  Scenario: A user can insert horizontal rules
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the insert hr editor button
+    Then the contents of the editable region should be "this is&nbsp;<hr size='2' width='100%'> <b>content</b>"
+
+    When I click on the insert hr editor button
+    Then the contents of the editable region should be "this is&nbsp;<hr size='2' width='100%'><hr size='2' width='100%'> <b>content</b>"
+
+
+#  Scenario: A user can clean/remove formatting on their selection
+    Given the content of the editable region has wrapped content
+    And I make a selection
+
+    When I click on the remove formatting editor button
+    Then the contents of the editable region should be "this is wrapped content"
+
+
+#  Scenario: A user can wrap content within predefined styles
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the style editor dropdown
+    And select the red style from the dropdown
+    Then the contents of the editable region should be "this is <span class='red'><span>simple</span></span> <b>content</b>"
+
+
+#  Scenario: A user can wrap content in formatted block tags
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the block format editor dropdown
+    And select the heading 2 block from the dropdown
+    Then the contents of the editable region should be "<h2>this is <span>simple</span> <b>content</b></h2>"
+
+
+#  Scenario: A user can set the background color of a selection
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the background color editor palette
+    And click on the color red
+    Then the contents of the editable region should be "this is <span style='background-color:#FF0000'><span>simple</span></span> <b>content</b>"
+
+
+#  Scenario: A user can set the foreground color
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the foreground color editor palette
+    And click on the color red
+    Then the contents of the editable region should be "this is <font color='rgb(255, 0, 0)'><span>simple</span></font> <b>content</b>"

data/features/regions/editable/inserting_links.feature

@@ -0,0 +1,98 @@
+@javascript
+Feature:
+  As a content editor type person
+  In order to manage content
+  I should be able to insert links of different types
+
+  Background:
+    Given I am on an editable page
+    And the editor won't prompt when leaving the page
+
+  Scenario: A user can expect all this!
+
+
+#  Scenario: A user can insert and edit a link to an external site
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the "Insert Link" button
+    Then the modal window should be visible
+    And the "Link Content" field should contain "simple"
+
+    When I fill in "URL" with "http://google.com"
+    And press "Insert Link"
+    Then the contents of the editable region should be "this is <a href='http://google.com'>simple</a> <b>content</b>"
+    And the modal window should not be visible
+
+    When I click on the "Insert Link" button
+    Then I should not see "Link Content"
+
+    When I fill in "URL" with "http://cnn.com"
+    And press "Insert Link"
+    Then the contents of the editable region should be "this is <a href='http://cnn.com'>simple</a> <b>content</b>"
+
+
+#  Scenario: A user can insert and edit a link with a target set
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the "Insert Link" button
+    And fill in "URL" with "http://google.com"
+    And select "Blank (a new window or tab)" from "Link Target"
+    And press "Insert Link"
+    Then the contents of the editable region should be "this is <a target='_blank' href='http://google.com'>simple</a> <b>content</b>"
+
+    When I click on the "Insert Link" button
+    And select "Top (removes any frames)" from "Link Target"
+    And press "Insert Link"
+    Then the contents of the editable region should be "this is <a target='_top' href='http://google.com'>simple</a> <b>content</b>"
+
+
+#  Scenario: A user can insert a link to an external site and open it in a popup
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the "Insert Link" button
+    And fill in "URL" with "http://google.com"
+    And select "Popup Window (javascript new window popup)" from "Link Target"
+    And I fill in "Popup Width" with "500"
+    And fill in "Popup Height" with "200"
+    And press "Insert Link"
+    Then the contents of the editable region should be "this is <a href='javascript:void(window.open('http://google.com', 'popup_window', 'width=500,height=200,menubar=no,toolbar=no'))'>simple</a> <b>content</b>"
+
+    When I click on the "Insert Link" button
+    Then the "Popup Width" field should contain "500"
+    And the "Popup Height" field should contain "200"
+
+
+#  Scenario: A user can insert a bookmark and then link to it
+    Given the content of the editable region is simple content
+    And I make a selection
+
+    When I click on the "Insert Link" button
+    And I choose "Bookmark"
+    And fill in "Bookmark" with "test-bookmark1"
+    And press "Insert Link"
+    Then the contents of the editable region should be "this is <a name='test-bookmark1'>simple</a> <b>content</b>"
+
+    When I make a selection for "b"
+    And click on the "Insert Link" button
+    And I choose "Existing Links"
+    And select "simple" from "Existing Links"
+    And press "Insert Link"
+    Then the contents of the editable region should be "this is <a name='test-bookmark1'>simple</a> <a href='#test-bookmark1'>content</a>"
+
+    When I make a selection for "a"
+    And click on the "Insert Link" button
+    # todo: this should prefill
+    #Then the "Bookmark" field should contain "test-bookmark1"
+    And I choose "Bookmark"
+    And fill in "Bookmark" with "test-bookmark2"
+    And press "Insert Link"
+    Then the contents of the editable region should be "this is <a name='test-bookmark2'>simple</a> <a href='#test-bookmark1'>content</a>"
+
+    # todo: when I change the name of a bookmark, and bookmarks that are pointing to me should also be updated (on this page)
+
+
+  Scenario: A user can navigate links inside of regions
+    # todo: finish