L-electron-Rare/moodle
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

MDL-78096 editor_tiny: Scenario updates for TinyMCE image enhancements

Browse Source
This commit is contained in:
meirzamoodle
2024-04-04 15:31:08 +07:00
parent 7fda4d6f63
commit 1927c6f668
10 changed files with 83 additions and 59 deletions
Download Patch File Download Diff File Expand all files Collapse all files
lib/editor/tiny/plugins/accessibilitychecker/tests/behat/accessibilitychecker.feature
+10 -9
View File
@@ -22,25 +22,26 @@ Feature: Tiny editor accessibility checker
Scenario: Perform accessibility validation on images with no alt attribute
Given I log in as "admin"
And I open my profile in edit mode
And I set the field "Description" to "<p>Some plain text</p><img src='/broken-image' width='1' height='1'/><p>Some more text</p>"
And I set the field "Description" to "<p>Some plain text</p><img src='http://download.moodle.org/unittest/test.jpg' width='1' height='1'/><p>Some more text</p>"
And I click on the "Tools > Accessibility checker" menu item for the "Description" TinyMCE editor
And I should see "Images require alternative text." in the "Accessibility checker" "dialogue"
And I click on "View" "link" in the "Accessibility checker" "dialogue"
And I click on the "Image" button for the "Description" TinyMCE editor
And the field "URL" matches value "/broken-image"
And I set the field "Describe this image for someone who cannot see it" to "No more warning!"
And I press "Save image"
And I wait "1" seconds
And I click on "This image is decorative only" "checkbox"
And I set the field "How would you describe this image to someone who can't see it:" to "No more warning!"
And I press "Save"
And I click on the "Tools > Accessibility checker" menu item for the "Description" TinyMCE editor
And I should see "Congratulations, no accessibility issues found!" in the "Accessibility checker" "dialogue"
And I click on "Close" "button" in the "Accessibility checker" "dialogue"
And I select the "img" element in position "2" of the "Description" TinyMCE editor
And I click on the "Image" button for the "Description" TinyMCE editor
And I set the field "URL" to "/decorative-image.png"
And I set the field "Describe this image for someone who cannot see it" to ""
And I set the field "Width" to "1"
And I set the field "Height" to "1"
And I set the field "URL" to "http://download.moodle.org/unittest/test.jpg"
And I click on "Add" "button" in the "Insert image" "dialogue"
And I wait "1" seconds
And I set the field "How would you describe this image to someone who can't see it:" to ""
And I click on "This image is decorative only" "checkbox"
When I press "Save image"
When I press "Save"
And I click on the "Tools > Accessibility checker" menu item for the "Description" TinyMCE editor
Then I should see "Congratulations, no accessibility issues found!" in the "Accessibility checker" "dialogue"
lib/editor/tiny/plugins/autosave/tests/behat/autosave.feature
+3 -3
View File
@@ -45,12 +45,12 @@ Feature: Tiny editor autosave
And I set the field "Course summary" to "<p>Image test</p>"
And I select the "p" element in position "1" of the "Course summary" TinyMCE editor
And I click on the "Image" button for the "Course summary" TinyMCE editor
And I click on "Browse repositories..." "button"
And I click on "Browse repositories" "button"
And I click on "Private files" "link" in the ".fp-repo-area" "css_element"
And I click on "tinyscreenshot.png" "link"
And I click on "Select this file" "button"
And I set the field "Describe this image" to "It's the Moodle"
And I click on "Save image" "button"
And I set the field "How would you describe this image to someone who can't see it:" to "It's the Moodle"
And I click on "Save" "button" in the "Image details" "dialogue"
And I click on "Save and display" "button"
When I am on the "Course 1" course page logged in as teacher1
And I navigate to "Settings" in current page administration
lib/editor/tiny/plugins/link/tests/behat/link.feature
+5 -5
View File
@@ -106,12 +106,12 @@ Feature: Add links to TinyMCE
And I click on "Save changes" "button"
And I open my profile in edit mode
And I click on the "Image" button for the "Description" TinyMCE editor
And I click on "Browse repositories..." "button" in the "Image properties" "dialogue"
And I click on "Browse repositories" "button" in the "Insert image" "dialogue"
And I select "Private files" repository in file picker
And I click on "moodle-logo.png" "link"
And I click on "Select this file" "button"
And I set the field "Describe this image for someone who cannot see it" to "It's the Moodle"
And I click on "Save image" "button" in the "Image properties" "dialogue"
And I set the field "How would you describe this image to someone who can't see it:" to "It's the Moodle"
And I click on "Save" "button" in the "Image details" "dialogue"
And I select the "img" element in position "0" of the "Description" TinyMCE editor
And I click on the "Link" button for the "Description" TinyMCE editor
And I set the field "Enter a URL" to "https://moodle.org/"
@@ -132,8 +132,8 @@ Feature: Add links to TinyMCE
And I click on "Edit profile" "link" in the "region-main" "region"
And I select the "img" element in position "0" of the "Description" TinyMCE editor
And I click on the "Image" button for the "Description" TinyMCE editor
And the field "Describe this image for someone who cannot see it" matches value "It's the Moodle"
And I click on "Close" "button" in the "Image properties" "dialogue"
And the field "How would you describe this image to someone who can't see it:" matches value "It's the Moodle"
And I click on "Close" "button" in the "Image details" "dialogue"
And I click on the "Link" button for the "Description" TinyMCE editor
And the field "Text to display" matches value "Moodle - Open-source learning platform"
And the field "Enter a URL" matches value "https://moodle.org/"
lib/editor/tiny/plugins/media/tests/behat/image.feature
+32 -9
View File
@@ -8,21 +8,21 @@ Feature: Use the TinyMCE editor to upload an image
Given I log in as "admin"
And I open my profile in edit mode
When I click on the "Image" button for the "Description" TinyMCE editor
Then "Image properties" "dialogue" should exist
Then "Insert image" "dialogue" should exist
Scenario: Browsing repositories in the TinyMCE editor shows the FilePicker
Scenario: Browsing repositories in the TinyMCE editor opens the image dialog and shows the FilePicker
Given I log in as "admin"
And I open my profile in edit mode
When I click on the "Image" button for the "Description" TinyMCE editor
And I click on "Browse repositories" "button" in the "Image properties" "dialogue"
And I click on "Browse repositories" "button" in the "Insert image" "dialogue"
Then "File picker" "dialogue" should exist
@_file_upload @test_tiny
Scenario: Browsing repositories in the TinyMCE editor shows the FilePicker
Scenario: Browsing repositories in the TinyMCE editor shows the FilePicker and upload url image
Given I log in as "admin"
And I open my profile in edit mode
When I click on the "Image" button for the "Description" TinyMCE editor
And I click on "Browse repositories" "button" in the "Image properties" "dialogue"
And I click on "Browse repositories" "button" in the "Insert image" "dialogue"
And I upload "/lib/editor/tiny/tests/behat/fixtures/tinyscreenshot.png" to the file picker for TinyMCE
# Note: This needs to be replaced with a label.
Then ".tiny_image_preview" "css_element" should be visible
@@ -32,12 +32,35 @@ Feature: Use the TinyMCE editor to upload an image
Given I log in as "admin"
And I open my profile in edit mode
And I click on the "Image" button for the "Description" TinyMCE editor
And I click on "Browse repositories..." "button" in the "Image properties" "dialogue"
And I click on "Browse repositories" "button" in the "Insert image" "dialogue"
And I upload "lib/editor/tiny/tests/behat/fixtures/moodle-logo.png" to the file picker for TinyMCE
And I set the field "Describe this image for someone who cannot see it" to "It's the Moodle"
And I click on "Save image" "button" in the "Image properties" "dialogue"
And I set the field "How would you describe this image to someone who can't see it:" to "It's the Moodle"
And I click on "Save" "button" in the "Image details" "dialogue"
When I select the "img" element in position "0" of the "Description" TinyMCE editor
And I click on the "Image" button for the "Description" TinyMCE editor
Then the field "Describe this image for someone who cannot see it" matches value "It's the Moodle"
Then the field "How would you describe this image to someone who can't see it:" matches value "It's the Moodle"
# Note: This needs to be replaced with a label.
And ".tiny_image_preview" "css_element" should be visible
@_file_upload
Scenario: Resizing the image uses the original and custom sizes and the keep proportion checkbox
Given I log in as "admin"
And I open my profile in edit mode
And I click on the "Image" button for the "Description" TinyMCE editor
And I click on "Browse repositories" "button" in the "Insert image" "dialogue"
And I upload "lib/editor/tiny/tests/behat/fixtures/moodle-logo.png" to the file picker for TinyMCE
And I click on "This image is decorative only" "checkbox"
And I click on "Save" "button" in the "Image details" "dialogue"
When I select the "img" element in position "0" of the "Description" TinyMCE editor
And I click on the "Image" button for the "Description" TinyMCE editor
Then the field "Original size" matches value "1"
And I click on "Custom size" "radio"
Then the field "Keep proportion" matches value "1"
And I click on "Keep proportion" "checkbox"
And I set the field "Width" to "102"
And I click on "Save" "button" in the "Image details" "dialogue"
When I select the "img" element in position "0" of the "Description" TinyMCE editor
And I click on the "Image" button for the "Description" TinyMCE editor
Then the field "Custom size" matches value "1"
And the field "Width" matches value "102"
And the field "Keep proportion" matches value "0"