MDL-44871 Atto behat tests: Modified the tests to work around focus bugs with workspaces

The main changes here are that the "select the text in" step was modified to select only the
first text node in the editor field, and to focus on it's parent instead of the entire editable div.

Some tests had to be modified to match the new behaviour, and another "real" bug was found in the table plugin.

lib/behat/form_field/behat_form_editor.php

@@ -80,6 +80,10 @@ editor.set("value", "' . $value . '");
     var e = document.getElementById("'.$editorid.'editable"),
         r = rangy.createRange(),
         s = rangy.getSelection();
+
+    while ((e.firstChild !== null) && (e.firstChild.nodeType != document.TEXT_NODE)) {
+        e = e.firstChild;
+    }
     e.focus();
     r.selectNodeContents(e);
     s.setSingleRange(r);

lib/editor/atto/plugins/accessibilityhelper/tests/behat/accessibilityhelper.feature

@@ -23,10 +23,12 @@ Feature: Atto accessibility helper
     Given I log in as "admin"
     And I follow "Admin User"
     And I follow "Edit profile"
-    And I set the field "Description" to "Some plain text"
-    And I click on "Unordered list" "button"
+    And I set the field "Description" to "<p>Some plain text</p>"
     When I click on "Show more buttons" "button"
+    And I select the text in the "Description" field
+    And I click on "Unordered list" "button"
     And I click on "Screenreader helper" "button"
+    And I select the text in the "Description" field
     # This shows the current HTML tags applied to the selected text.
     # This is required because they are not always read by a screen reader.
     Then I should see "UL, LI"

lib/editor/atto/plugins/charmap/tests/behat/charmap.feature

@@ -3,16 +3,17 @@ Feature: Atto charmap button
   To format text in Atto, I need to add symbols
 
   @javascript
-  Scenario: Insert synbols
+  Scenario: Insert symbols
     Given I log in as "admin"
     And I follow "Admin User"
     And I follow "Edit profile"
     And I set the field "Text editor" to "Plain text area"
-    And I set the field "Description" to "1980 Mullet"
+    And I set the field "Description" to "<p>1980 Mullet</p>"
+    And I select the text in the "Description" field
     When I click on "Show more buttons" "button"
     And I click on "Insert character" "button"
     And I click on "copyright sign" "button"
     And I press "Update profile"
     And I follow "Edit profile"
-    Then I should see "(c)1980 Mullet"
+    Then I should see "(c)"
 

lib/editor/atto/plugins/clear/tests/behat/clear.feature

@@ -1,4 +1,4 @@
-@atto @atto_clear
+@atto @atto_clear @_bug_phantomjs
 Feature: Atto clear button
   To format text in Atto, I need to remove formatting
 

lib/editor/atto/plugins/equation/tests/behat/equation.feature

@@ -7,6 +7,8 @@ Feature: Atto equation editor
     Given I log in as "admin"
     When I follow "Admin User"
     And I follow "Edit profile"
+    And I set the field "Description" to "<p>Equation test</p>"
+    And I select the text in the "Description" field
     And I click on "Show more buttons" "button"
     And I click on "Equation editor" "button"
     And I set the field "Edit equation using" to " = 1 \div 0"

lib/editor/atto/plugins/image/tests/behat/image.feature

@@ -10,6 +10,8 @@ Feature: Add images to Atto
     And I click on "Save changes" "button"
     When I follow "Admin User"
     And I follow "Edit profile"
+    And I set the field "Description" to "<p>Image test</p>"
+    And I select the text in the "Description" field
     And I click on "Image" "button"
     And I click on "Browse repositories..." "button"
     And I click on "Private files" "link"

lib/editor/atto/plugins/media/tests/behat/media.feature

@@ -12,6 +12,8 @@ Feature: Add media to Atto
     And I expand "My profile" node
     And I expand "Blogs" node
     And I follow "Add a new entry"
+    And I set the field "Blog entry body" to "<p>Media test</p>"
+    And I select the text in the "Blog entry body" field
     And I set the field "Entry title" to "The best video in the entire world (not really)"
     And I click on "Media" "button"
     And I click on "Browse repositories..." "button"

lib/editor/atto/plugins/table/tests/behat/table.feature

@@ -1,4 +1,4 @@
-@atto @atto_table
+@atto @atto_table @_bug_phantomjs
 Feature: Atto tables
   To format text in Atto, I need to create tables
 
@@ -10,13 +10,31 @@ Feature: Atto tables
     And I expand "Blogs" node
     And I follow "Add a new entry"
     And I set the field "Entry title" to "How to make a table"
+    And I set the field "Blog entry body" to "Table test"
+    And I select the text in the "Blog entry body" field
     And I click on "Show more buttons" "button"
     When I click on "Table" "button"
     And I set the field "Caption" to "Dinner"
     And I press "Create table"
-    And I select the text in the "Blog entry body" field
-    And I click on "Table" "button"
-    And I click on "Insert column after" "link"
     And I press "Save changes"
     Then ".blog_entry table caption" "css_element" should be visible
 
+  @javascript
+  Scenario: Edit a table
+    Given I log in as "admin"
+    And I am on homepage
+    And I expand "My profile" node
+    And I expand "Blogs" node
+    And I follow "Add a new entry"
+    And I set the field "Entry title" to "How to make a table"
+    And I set the field "Blog entry body" to "<table><tr><td>Cell</td></tr></table>"
+    And I select the text in the "Blog entry body" field
+    And I click on "Show more buttons" "button"
+    And I click on "Table" "button"
+    And I click on "Edit table" "link"
+    And I set the field "Caption" to "Dinner"
+    And I press "Update table"
+    And I press "Save changes"
+    Then ".blog_entry table caption" "css_element" should be visible
+
+

lib/editor/atto/plugins/table/yui/build/moodle-atto_table-button/moodle-atto_table-button-debug.js

@@ -391,6 +391,8 @@ Y.namespace('M.atto_table').Button = Y.Base.create('button', Y.M.editor_atto.Edi
 
             }, this);
         }
+        // Clean the HTML.
+        this.markUpdated();
     },
 
     /**

lib/editor/atto/plugins/table/yui/build/moodle-atto_table-button/moodle-atto_table-button.js

@@ -391,6 +391,8 @@ Y.namespace('M.atto_table').Button = Y.Base.create('button', Y.M.editor_atto.Edi
 
             }, this);
         }
+        // Clean the HTML.
+        this.markUpdated();
     },
 
     /**

lib/editor/atto/plugins/table/yui/src/button/js/button.js

@@ -389,6 +389,8 @@ Y.namespace('M.atto_table').Button = Y.Base.create('button', Y.M.editor_atto.Edi
 
             }, this);
         }
+        // Clean the HTML.
+        this.markUpdated();
     },
 
     /**