Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

NEW LinkField Behat tests #201

Merged
merged 1 commit into from
Feb 13, 2024
Merged

NEW LinkField Behat tests #201

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
31 changes: 31 additions & 0 deletions behat.yml
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
# Run linkfield behat tests with this command
# Note that linkfield behat tests require CMS module
# ========================================================================= #
# chromedriver
# vendor/bin/behat @linkfield
# ========================================================================= #
default:
suites:
linkfield:
paths:
- '%paths.modules.linkfield%/tests/behat/features'
contexts:
- SilverStripe\Framework\Tests\Behaviour\FeatureContext
- SilverStripe\Framework\Tests\Behaviour\CmsFormsContext
- SilverStripe\Framework\Tests\Behaviour\CmsUiContext
- SilverStripe\BehatExtension\Context\BasicContext
- SilverStripe\BehatExtension\Context\LoginContext
- SilverStripe\BehatExtension\Context\FixtureContext:
- '%paths.modules.linkfield%/tests/behat/features/files/'

extensions:
SilverStripe\BehatExtension\MinkExtension:
default_session: facebook_web_driver
javascript_session: facebook_web_driver
facebook_web_driver:
browser: chrome
wd_host: "http://127.0.0.1:9515" #chromedriver port

SilverStripe\BehatExtension\Extension:
screenshot_path: '%paths.base%/artifacts/screenshots'
bootstrap_file: vendor/silverstripe/framework/tests/behat/serve-bootstrap.php
1 change: 1 addition & 0 deletions composer.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -20,6 +20,7 @@
"silverstripe/versioned": "^2"
},
"require-dev": {
"silverstripe/frameworktest": "^1",
"dnadesign/silverstripe-elemental": "^5",
"silverstripe/recipe-testing": "^3",
"squizlabs/php_codesniffer": "^3",
Expand Down
144 changes: 144 additions & 0 deletions tests/behat/features/create-edit-linkfield.feature
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,144 @@
Feature: Create Links in LinkField and MultiLinkField
As a content editor
I want to add links to pages, files, external URLs, email addresses and phone numbers

Background:
Given I add an extension "SilverStripe\FrameworkTest\LinkField\Extensions\LinkPageExtension" to the "Page" class
And I go to "/dev/build?flush"
And a "page" "Link Page"
And the "group" "EDITOR" has permissions "Access to 'Pages' section"
And I am logged in as a member of "EDITOR" group
And I go to "/admin/pages"
And I should see "Link Page"
And I click on "Link Page" in the tree

Scenario: I click on the link fields and see the list of allowed link types with icons for LinkFields
Given I should see the "#Form_EditForm_HasManyLinks" element
And I should see the "#Form_EditForm_HasOneLink" element

# Test limited list of link types are present in correct order in the dropdown

When I click on the "[data-field-id='Form_EditForm_HasOneLink'] button" element
Then I should see the "[data-field-id='Form_EditForm_HasOneLink'] .dropdown-menu.show" element

And I should see the "[data-field-id='Form_EditForm_HasOneLink'] .dropdown-item:nth-of-type(1) .font-icon-page" element
And I should see "Page on this site" in the "[data-field-id='Form_EditForm_HasOneLink'] .dropdown-item:nth-of-type(1)" element

And I should see the "[data-field-id='Form_EditForm_HasOneLink'] .dropdown-item:nth-of-type(2) .font-icon-p-mail" element
And I should see "Link to email address" in the "[data-field-id='Form_EditForm_HasOneLink'] .dropdown-item:nth-of-type(2)" element

And I should see the "[data-field-id='Form_EditForm_HasOneLink'] .dropdown-item:nth-of-type(3) .font-icon-mobile" element
And I should see "Phone number" in the "[data-field-id='Form_EditForm_HasOneLink'] .dropdown-item:nth-of-type(3)" element

# Test full list of link types are present in correct order in the dropdown

When I click on the "[data-field-id='Form_EditForm_HasManyLinks'] button" element
Then I should see the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-menu.show" element

And I should see the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-item:nth-of-type(1) .font-icon-page" element
And I should see "Page on this site" in the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-item:nth-of-type(1)" element

And I should see the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-item:nth-of-type(2) .font-icon-image" element
And I should see "Link to a file" in the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-item:nth-of-type(2)" element

And I should see the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-item:nth-of-type(3) .font-icon-external-link" element
And I should see "Link to external URL" in the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-item:nth-of-type(3)" element

And I should see the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-item:nth-of-type(4) .font-icon-p-mail" element
And I should see "Link to email address" in the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-item:nth-of-type(4)" element

And I should see the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-item:nth-of-type(5) .font-icon-mobile" element
And I should see "Phone number" in the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-item:nth-of-type(5)" element

# Test that user can create email link in LinkField

When I click on the "[data-field-id='Form_EditForm_HasOneLink'] button" element
Then I should see "Link to email address" in the "[data-field-id='Form_EditForm_HasOneLink'] .dropdown-item:nth-of-type(2)" element
When I click on the "[data-field-id='Form_EditForm_HasOneLink'] .dropdown-item:nth-of-type(2)" element
And I wait for 5 seconds
Then I should see "Link to email address" in the ".modal-header" element
Then I fill in "LinkText" with "Email link"
And I fill in "Email" with "email@example.com"
And I should not see "Open in new window" in the ".modal-content" element
And I press the "Create link" button
And I wait for 2 seconds

# Create SiteTreeLink in MultiLinkField

When I click on the "[data-field-id='Form_EditForm_HasManyLinks'] button" element
Then I should see "Page on this site" in the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-menu.show" element
When I click on the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-item:nth-of-type(1)" element
Then I should see "Page on this site" in the ".modal-header" element
And I wait for 2 seconds
And I press the "Create link" button
Then I should see "Page is required" in the ".modal-content" element
Then I fill in "LinkText" with "About Us"
And I select "About Us" in the "#Form_LinkForm_0_PageID_Holder" tree dropdown
And I fill in "QueryString" with "option=value"
And I check "Open in new window"
And I press the "Create link" button
And I wait for 2 seconds

# Create ExternalLink in MultiLinkField

When I click on the "[data-field-id='Form_EditForm_HasManyLinks'] button" element
Then I should see "Link to external URL" in the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-item:nth-of-type(3)" element
When I click on the "[data-field-id='Form_EditForm_HasManyLinks'] .dropdown-item:nth-of-type(3)" element
And I wait for 5 seconds
Then I should see "Link to external URL" in the ".modal-header" element
Then I fill in "LinkText" with "External URL"
And I fill in "ExternalUrl" with "w1234@$%"
And I press the "Create link" button
Then I should see "Please enter a valid URL" in the ".modal-content" element
Then I fill in "ExternalUrl" with "https://www.silverstripe.org"
And I check "Open in new window"
And I press the "Create link" button
And I wait for 2 seconds

# Test that all links are created

# Link ID 1
Then I should see "Email link" in the "[data-field-id='Form_EditForm_HasOneLink']" element
And I should see "email@example.com" in the "[data-field-id='Form_EditForm_HasOneLink'] .link-picker__link" element
And I should see "Draft" in the "[data-field-id='Form_EditForm_HasOneLink']" element

# Link ID 2
And I should see "About Us" in the "[data-field-id='Form_EditForm_HasManyLinks'] .link-picker__link--is-first" element
And I should see "about-us" in the "[data-field-id='Form_EditForm_HasManyLinks'] .link-picker__link--is-first" element
And I should see "Draft" in the "[data-field-id='Form_EditForm_HasManyLinks'] .link-picker__link--is-first" element

# Link ID 3
And I should see "External URL" in the "[data-field-id='Form_EditForm_HasManyLinks'] .link-picker__link--is-last" element
And I should see "https://www.silverstripe.org" in the "[data-field-id='Form_EditForm_HasManyLinks'] .link-picker__link--is-last" element
And I should see "Draft" in the "[data-field-id='Form_EditForm_HasManyLinks'] .link-picker__link--is-last" element

# Test that user can publish the page with links

When I press the "Publish" button
And I wait for 2 seconds
And I should not see "Draft" in the "[data-field-id='Form_EditForm_HasOneLink']" element
And I should not see "Draft" in the "[data-field-id='Form_EditForm_HasManyLinks']" element

# Test that user can edit links

When I click on the "[data-field-id='Form_EditForm_HasManyLinks'] .link-picker__link--is-first button" element
Then I should see "Page on this site" in the ".modal-header" element
Then I fill in "LinkText" with "All about us"
And I press the "Update link" button
And I wait for 2 seconds
And I should see "All about us" in the "[data-field-id='Form_EditForm_HasManyLinks'] .link-picker__link--is-first" element
And I should see "Modified" in the "[data-field-id='Form_EditForm_HasManyLinks'] .link-picker__link--is-first" element

# Test that user can reorder links

And I drag the "[data-field-id='Form_EditForm_HasManyLinks'] .link-picker__link--is-first" element to the "[data-field-id='Form_EditForm_HasManyLinks'] .link-picker__link--is-last" element
And I wait for 3 seconds
And I should see "All about us" in the "[data-field-id='Form_EditForm_HasManyLinks'] .link-picker__link--is-last" element
And I should see "External URL" in the "[data-field-id='Form_EditForm_HasManyLinks'] .link-picker__link--is-first" element

# Test that user can delete the link

When I click on the "[data-field-id='Form_EditForm_HasOneLink'] .link-picker__delete" element, confirming the dialog
And I wait for 3 seconds
Then I should not see "Email link" in the "[data-field-id='Form_EditForm_HasOneLink']" element
Then I press the "Publish" button
Binary file added tests/behat/features/files/file1.jpg
View file
Open in desktop
Loading
Sorry, something went wrong. Reload?
Sorry, we cannot display this file.
Sorry, this file is invalid so it cannot be displayed.
107 changes: 107 additions & 0 deletions tests/behat/features/linkfield-in-elemental.feature
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -0,0 +1,107 @@
Feature: Create Links in LinkField and MultiLinkField as part of Elemental Block
As a content editor
I want to be able to work with LinkField and MultiLinkField in Elemental Block

Background:
Given I add an extension "DNADesign\Elemental\Extensions\ElementalPageExtension" to the "Page" class
And I add an extension "SilverStripe\FrameworkTest\LinkField\Extensions\ElementContentExtension" to the "DNADesign\Elemental\Models\BaseElement" class
And I go to "/dev/build?flush"
And a "page" "Link Blocks Page"
And the "group" "EDITOR" has permissions "Access to 'Pages' section"
And I am logged in as a member of "EDITOR" group
And I go to "/admin/pages"
And I should see "Link Blocks Page"
And I click on "Link Blocks Page" in the tree

Scenario: I can create link blocks page
Given I press the "Add block" button
# There are few buttons on the page with 'Content' text
Then I click on the ".font-icon-block-content" element
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I have to change this to class name since there are more than one "Content" button on the page

Then I should see "Untitled Content block" in the ".element-editor__element" element
And I click on the ".element-editor__element" element

# Test that user can create link in LinkField

When I click on the "#Form_ElementForm_1_PageElements_1_OneLink_Holder button" element
Then I should see the "#Form_ElementForm_1_PageElements_1_OneLink_Holder .dropdown-menu.show" element
And I should see "Link to email address" in the "#Form_ElementForm_1_PageElements_1_OneLink_Holder .dropdown-item:nth-of-type(2)" element
When I click on the "#Form_ElementForm_1_PageElements_1_OneLink_Holder .dropdown-item:nth-of-type(2)" element
And I wait for 5 seconds
Then I should see "Link to email address" in the ".modal-header" element
Then I fill in "LinkText" with "Email link"
And I fill in "Email" with "email@example.com"
And I should not see "Open in new window" in the ".modal-content" element
And I press the "Create link" button
And I wait for 2 seconds

# Test that user can create link in MultiLinkField
# Create SiteTreeLink in MultiLinkField

When I click on the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder button" element
Then I should see the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .dropdown-menu.show" element
And I should see "Page on this site" in the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .dropdown-item:nth-of-type(1)" element
When I click on the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .dropdown-item:nth-of-type(1)" element
Then I should see "Page on this site" in the ".modal-header" element
And I wait for 2 seconds
Then I fill in "LinkText" with "About Us"
And I select "About Us" in the "#Form_LinkForm_0_PageID_Holder" tree dropdown
And I fill in "QueryString" with "option=value"
And I check "Open in new window"
And I press the "Create link" button
And I wait for 2 seconds

# Create ExternalLink in MultiLinkField

When I click on the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder button" element
Then I should see the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .dropdown-menu.show" element
And I should see "Phone number" in the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .dropdown-item:nth-of-type(5)" element
When I click on the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .dropdown-item:nth-of-type(5)" element
And I wait for 5 seconds
Then I should see "Phone number" in the ".modal-header" element
Then I fill in "LinkText" with "Phone"
Then I fill in "Phone" with "12345678"
And I should not see "Open in new window" in the ".modal-content" element
And I press the "Create link" button
And I wait for 2 seconds

# Test that all links are created

# Link ID 1
Then I should see "Email link" in the "#Form_ElementForm_1_PageElements_1_OneLink_Holder" element
And I should see "email@example.com" in the "#Form_ElementForm_1_PageElements_1_OneLink_Holder .link-picker__link" element
And I should see "Draft" in the "#Form_ElementForm_1_PageElements_1_OneLink_Holder" element

# Link ID 2
And I should see "About Us" in the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .link-picker__link--is-first" element
And I should see "about-us" in the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .link-picker__link--is-first" element
And I should see "Draft" in the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .link-picker__link--is-first" element

# Link ID 3
And I should see "Phone" in the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .link-picker__link--is-last" element
And I should see "12345678" in the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .link-picker__link--is-last" element
And I should see "Draft" in the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .link-picker__link--is-last" element

# Test that user can publish the page with links

When I press the "Publish" button
And I wait for 2 seconds
Then I click on the ".element-editor__element" element
And I should not see "Draft" in the "#Form_ElementForm_1_PageElements_1_OneLink_Holder" element
And I should not see "Draft" in the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder" element

# Test that user can edit links

When I click on the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .link-picker__link--is-first button" element
Then I should see "Page on this site" in the ".modal-header" element
Then I fill in "LinkText" with "All about us"
And I press the "Update link" button
And I wait for 2 seconds
And I should see "All about us" in the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .link-picker__link--is-first" element
And I should see "Modified" in the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .link-picker__link--is-first" element

# Test that user can delete the link

When I click on the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .link-picker__delete" element, confirming the dialog
And I wait for 3 seconds
Then I should not see "All about us" in the "#Form_ElementForm_1_PageElements_1_ManyLinks_Holder .link-picker__link--is-first" element
Then I press the "Publish" button
Loading