From 1c54da7e9584049c11fd350c22c075d39f7d555c Mon Sep 17 00:00:00 2001 From: Sabina Talipova Date: Thu, 1 Feb 2024 12:03:16 +1300 Subject: [PATCH] NEW LinkField Behat tests --- behat.yml | 31 ++++ composer.json | 1 + .../features/create-edit-linkfield.feature | 144 ++++++++++++++++++ tests/behat/features/files/file1.jpg | Bin 0 -> 2292 bytes .../features/linkfield-in-elemental.feature | 107 +++++++++++++ 5 files changed, 283 insertions(+) create mode 100644 behat.yml create mode 100644 tests/behat/features/create-edit-linkfield.feature create mode 100644 tests/behat/features/files/file1.jpg create mode 100644 tests/behat/features/linkfield-in-elemental.feature diff --git a/behat.yml b/behat.yml new file mode 100644 index 00000000..83ae0e65 --- /dev/null +++ b/behat.yml @@ -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 diff --git a/composer.json b/composer.json index 8fc2de3b..2de36a15 100644 --- a/composer.json +++ b/composer.json @@ -20,6 +20,7 @@ "silverstripe/versioned": "^2" }, "require-dev": { + "silverstripe/frameworktest": "^1", "dnadesign/silverstripe-elemental": "^5", "silverstripe/recipe-testing": "^3", "squizlabs/php_codesniffer": "^3", diff --git a/tests/behat/features/create-edit-linkfield.feature b/tests/behat/features/create-edit-linkfield.feature new file mode 100644 index 00000000..49684deb --- /dev/null +++ b/tests/behat/features/create-edit-linkfield.feature @@ -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 "Form_LinkForm_0_LinkText" with "Email link" + And I fill in "Form_LinkForm_0_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 "Form_LinkForm_0_LinkText" with "About Us" + And I select "About Us" in the "#Form_LinkForm_0_PageID_Holder" tree dropdown + And I fill in "Form_LinkForm_0_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 "Form_LinkForm_0_LinkText" with "External URL" + And I fill in "Form_LinkForm_0_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 "Form_LinkForm_0_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 "Form_LinkForm_2_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 \ No newline at end of file diff --git a/tests/behat/features/files/file1.jpg b/tests/behat/features/files/file1.jpg new file mode 100644 index 0000000000000000000000000000000000000000..beb5a91b0aba93d3b54dadc12cff0104307d718e GIT binary patch literal 2292 zcmbV~c|6qJ9>;%UHjExS$z>*csbTDTlq4fO5~U_1OJm>1u4{=xiK_^q9w8LDu4RZU z8557($~v-CGowgKGnQ!>GxN;U>viux_m6w;=e)k(*IB;jygu)9j^K@e2FN&K9k2ih z1OOmm0|b2FS6eqbn=>wMhfslj2ScL#15xo9v>{3_E+#l45ar-#k8(U^XOD_EGun3m zMU3+e3yw`f9Y$H2N($xxTR;pXk|>Lb1ObaO6aoQ5U{DzBN5Cb-VQ>jJ3?_~cmyi@m z*pos?N{I%dLw;@*gMz_ONjMDtqvU@|f@grNIA8=Afk7I8m@Eh^3ldNOq!1GN!=8}z zr$Az02owev+CT^kNHRkEV6f0MROnb(og!QZAhJ-oy%-yqysIxV&@@|zq+B&*=`}UidnweWz9W@cqyyPi`}c)O^$RrQ0K+Pa62>RVddNbMa@I=jdNl;?v( ze+<7EpO~DYPQRI%r85>jd|X`mwEUU1w!X2+{?6Ij7IA?9@J}pZ{*PR;LM}1U8^A?e zAh85tfMp@jy%?CBjVs)jD6e6ZF0OFwR%LU)gr>0@Q}JT-n52@H30<2dLi<7X-+^WP zUu6FR`#0AtAO!{q9}g@GSOYtk7S!~}8_$uB+tPfA6|UScm#}l9_X_1u&tL^TQrcdj z>+Q>0tL3s|#Fe0ldmx9gHPI4kJ)~!b1g|z(yjN8XLXuJS` zbkD^*z5G3tsmzY%^l%+H!&dUleDZ1USK^@~9a{$<->ldybWF6F1{a6<+N$d#8AAgp zF*E@{=}DkRUa!e;;(^bU4KCsXbS(Fn>-RVSUwuF-0BsG#=yT*B;m`NAB6s9h`d>5U z*+I!zwFZ}WM9j}@ilS9JY$m9{% zsipE$tY6wzt5%oilB;$vxZ$B)^iwIL(cE|@3X!9 zbDTr53I6Tz7Vf2L?$z^&yIy=qePSj`q;Sh*>J)8~lG@3xHx8B!&?D3*4f z(16K+;)d7>XX`?zlMS|;WkY<4M_lzC8P1ia)Nya69S5E28twV6Tr)4-C%HIWYv;`p zTFU*5sQNAVW%oH)uPc)2`u@gP@{ucS0`FF`%&cKK#iMe(X=8+7xbU!S*y$YfG} zd!*;~%s9DPl~}k|wAj%YqC~`n?CF_g;&br>rUQqLThBn~X_7ouUO~4nSB>9a(PEyR zYQ=fM82>hyYA~Vx>0tfi*&?c+Ki5RkW%Z(S<%R3+=sK-?4c_)yg9C<->6uQuAmw+P z;wM73KYb_lJxGnY^I^(JN-JdXWKvPmD@={^;Mhq_QF-2Mi*u)0MeW*Q7fLY8e88IN z^iAG|>;KtsJ~5jw^VZJ5gK<0w(h{lU`qbdX1UyJtlhZtGsk?^cL-gmUr7TrLk#9c^FourW>LL;vTauCJy%?{X4MKQ47hT0+*~|arf=qg$=ZZpIf=5s9ayg_A#PN4J0T-0M|ZS11V(s}GqPVIYIU|8(Oode6acclYO}%9{6kE$M-OZo=C-yyXY&dv9s5YCdN`?_7VMjq_Tz_D9N2jX zzNGAes%lE4CzY=jq&&-;{#(iOONt{y(Z$;lRgq|eJwDf?YF;?+-#s=ml&N7?n6uuL zpVn4EF_<;__FFG&W&dz3x&Q30liRolrQ=!!#9c2b&2z2S2nX6%6as@lfIEU1*V(9j zzpO4?`p6JhBgZU%O|S6;>{IIPs}&x4_u)R5T+^5B6oBju%(2V%8aaBvvke7TJ0MLk F^Cu<`6}$id literal 0 HcmV?d00001 diff --git a/tests/behat/features/linkfield-in-elemental.feature b/tests/behat/features/linkfield-in-elemental.feature new file mode 100644 index 00000000..0765dfa9 --- /dev/null +++ b/tests/behat/features/linkfield-in-elemental.feature @@ -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 + 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 "Form_LinkForm_0_LinkText" with "Email link" + And I fill in "Form_LinkForm_0_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 "Form_LinkForm_0_LinkText" with "About Us" + And I select "About Us" in the "#Form_LinkForm_0_PageID_Holder" tree dropdown + And I fill in "Form_LinkForm_0_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 "Form_LinkForm_0_LinkText" with "Phone" + Then I fill in "Form_LinkForm_0_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 "Form_LinkForm_2_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