Skip to content
Snippets Groups Projects
Commit 5632f88b authored by Alaa Jwiehan's avatar Alaa Jwiehan Committed by Rajab Natshah
Browse files

Issue #3263378 by Alaa Jwiehan: Add smart step definitions related to adding... 

Issue #3263378 by Alaa Jwiehan: Add smart step definitions related to adding sections, padding, margin, border radius and adding blocks
parent 2c90041c
No related branches found
No related tags found
4 merge requests!24Issue #3301451: Composer is fixed to docroot folder Primary tabs View(active tab),!10Issue #3269421: Add exception messages for VLB automated testing step definitions,!9Issue #3266504: Update Automated Functional Testing Readme File,!7Issue #3263378 by Alaa Jwiehan: Add smart step definitions related to adding sections, padding, margin, border radius and adding blocks
Hide whitespace changes
Inline Side-by-side
tests/features/bootstrap/VarbaseContext.php
+ 260
− 353
View file @ 5632f88b
...@@ -669,24 +669,58 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -669,24 +669,58 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
} }
/** /**
* =========================================================
*
* Section Configuration Functions * Section Configuration Functions
* *
* ========================================================= * =========================================================
*/ */
/**
* Add a basic section at the end of layout
*
* Varbase Context #varbase
*
* Example #1: When I add a basic "4 Cols" section at the end of layout
* Example #2: And I add a basic section at the end of layout
*
* @When I add a basic section at the end of layout
* @When I add a basic :arg1 section at the end of layout
* @And I add a basic (?:|arg1 ) section at the end of layout
*/
public function iAddABasicSectionAtTheEndOfLayout($cols = "1 Col") {
$this->iScrollToBottom();
$this->iWaitForSeconds(1);
$end_layout = $this->getSession()->getPage()->find('xpath', "//a[contains(@class, 'use-ajax layout-builder__link layout-builder__link--add') and contains(., 'at end of layout')]")->click();
$this->iWaitForSeconds(1);
$section = $this->getSession()->getPage()->find('xpath', "//*[contains(., '$cols') and contains(@class, 'use-ajax')]")->click();
$this->iWaitForSeconds(1);
}
/**
* @When I save the section
*/
public function iSaveTheSection() {
$save = $this->getSession()->getPage()->find('xpath', "//button[contains(@value, 'Add section')]")->click();
}
/** /**
* Select a section container type * Select a section container type
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: When I select the "Edge to Edge" container type * Example #1: When I select the "Edge to Edge" container type
* Example #2: And I select the "Boxed" container type * Example #2: And I select the "Boxed" container type with a "Tiny" width
* *
* @When I select the :arg1 container type * @When I select the :arg1 container type
* @When I select the :type container type with a :width width
*/ */
public function iSelectTheContainerType($name) { public function iSelectTheContainerType($type, $width = NULL) {
$element = $this->getSession()->getPage()->find('xpath', "//label[contains(.,'$name') and contains(@for, 'edit-layout-settings-ui-tab-content-layout-container-type')]"); $element = $this->getSession()->getPage()->find('xpath', "//label[contains(.,'$type') and contains(@for, 'edit-layout-settings-ui-tab-content-layout-container-type')]")->click();
$element->click(); if($type === "Boxed" && isset($width)){
$this->iSelectTheContainerWidth($width);
}
} }
/** /**
...@@ -700,24 +734,22 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -700,24 +734,22 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
* @When I select the :arg1 container width * @When I select the :arg1 container width
*/ */
public function iSelectTheContainerWidth($width) { public function iSelectTheContainerWidth($width) {
$element = $this->getSession()->getPage()->find('xpath', "//label[contains(.,'$width') and contains(@for, 'edit-layout-settings-ui-tab-content-layout-container-width')]"); $element = $this->getSession()->getPage()->find('xpath', "//label[contains(.,'$width') and contains(@for, 'edit-layout-settings-ui-tab-content-layout-container-width')]")->click();
$element->click();
} }
/** /**
* Select a section breakpoint * Select a section breakpoint
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: When I select the "md" "33% 67%" breakpoint * Example #1: When I select the "md" "33% 67%" section breakpoint
* Example #2: And I select the "xs" "75% 25%" breakpoint * Example #2: And I select the "xs" "75% 25%" section breakpoint
* *
* *
* @When I select the :arg1 :arg2 breakpoint * @When I select the :arg1 :arg2 section breakpoint
*/ */
public function iSelectTheBreakpoint($size, $point) { public function iSelectTheSectionBreakpoint($size, $point) {
$element = $this->getSession()->getPage()->find('xpath', "//*[contains(@class,'$size') and contains(.,'$point')]"); $element = $this->getSession()->getPage()->find('xpath', "//*[contains(@class,'$size') and contains(.,'$point')]")->click();
$element->click();
} }
/** /**
...@@ -725,14 +757,13 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -725,14 +757,13 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: When I add gutters * Example #1: When I add section gutters
* Example #2: And I add gutters * Example #2: And I add section gutters
* *
* @When I add gutters * @When I add section gutters
*/ */
public function iAddGutters() { public function iAddSectionGutters() {
$with_gutters = $this->getSession()->getPage()->find('xpath', "//label[contains(., 'With Gutters')]"); $with_gutters = $this->getSession()->getPage()->find('xpath', "//label[contains(., 'With Gutters')]")->click();
$with_gutters->click();
} }
/** /**
...@@ -740,29 +771,27 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -740,29 +771,27 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: When I remove gutters between columns * Example #1: When I remove gutters between section columns
* Example #2: And I remove gutters between columns * Example #2: And I remove gutters between section columns
* *
* @When I remove gutters between columns * @When I remove gutters between section columns
*/ */
public function iRemoveGuttersBetweenColumns() { public function iRemoveGuttersBetweenSectionColumns() {
$no_gutters = $this->getSession()->getPage()->find('xpath', "//*[contains(@class, 'vlb_gutters_between')]"); $no_gutters = $this->getSession()->getPage()->find('xpath', "//*[contains(@class, 'vlb_gutters_between')]")->click();
$no_gutters->click();
} }
/** /**
* Move to the styles tab * Move to the section styles tab
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: When I move to the styles tab * Example #1: When I move to the section styles tab
* Example #2: And I move to the styles tab * Example #2: And I move to the section styles tab
* *
* @When I move to the styles tab * @When I move to the section styles tab
*/ */
public function iMoveToTheStylesTab() { public function iMoveToTheSectionStylesTab() {
$styles_tab = $this->getSession()->getPage()->find('xpath', "//a[contains(@data-target, 'appearance')]"); $styles_tab = $this->getSession()->getPage()->find('xpath', "//a[contains(@data-target, 'appearance')]")->click();
$styles_tab->click();
} }
/** /**
...@@ -770,29 +799,36 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -770,29 +799,36 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: When I open the "Background" settings menu * Example #1: When I open the section "Background" settings menu
* Example #2: And I open the "Border" settings menu * Example #2: And I open the section "Border" settings menu
* *
* @When I open the :arg1 settings menu * @When I open the section :arg1 settings menu
*/ */
public function iOpenTheSettingsMenu($menu) { public function iOpenTheSectionSettingsMenu($menu) {
$menu = $this->getSession()->getPage()->find('xpath', "//span[contains(., '$menu') and contains(@class, 'bs-group-title')]"); $this->iMoveToTheSectionStylesTab();
$menu->click(); $js = <<<JS
var title = "$menu";
const xpath = "//span[contains(text(),'" + title + "')]";
const js_menu = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
js_menu.closest("details").setAttribute("open", "");
JS;
$this->getSession()->executeScript($js);
} }
/** /**
* Select a background color * Select a section background color
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: When I select the "Primary" background color * Example #1: When I select the "Primary" section background color
* Example #2: And I select the "Light" background color * Example #2: And I select the "Light" section background color
* *
* @When I select the :arg1 background color * @When I select the :arg1 section background color
*/ */
public function iSelectTheBackgroundColor($bg_color) { public function iSelectTheSectionBackgroundColor($bg_color) {
$bg_color = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$bg_color') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-background-background-color')]"); $this->iOpenTheSectionSettingsMenu("Background");
$bg_color->click(); $bg_color = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$bg_color') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-background-background-color')]")->click();
} }
/** /**
...@@ -801,28 +837,28 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -801,28 +837,28 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
* Varbase Contaxt #varbase * Varbase Contaxt #varbase
* *
* Example #1: When I uncheck the Edge to Edge Background * Example #1: When I uncheck the Edge to Edge Background
* Example #2: And I uncheck the Edge to Edge Background * Example #2: And I uncheck the Edge to Edge Background
* *
* @When I uncheck the Edge to Edge Background * @When I uncheck the Edge to Edge Background
*/ */
public function iUncheckTheEdgeToEdgeBackground() { public function iUncheckTheEdgeToEdgeBackground() {
$e2e = $this->getSession()->getPage()->find('xpath', "//input[contains(@class, 'field-background-edge-to-edge')]"); $this->iOpenTheSectionSettingsMenu("Background");
$e2e->click(); $e2e = $this->getSession()->getPage()->find('xpath', "//input[contains(@class, 'field-background-edge-to-edge')]")->click();
} }
/** /**
* Select a text color * Select a section text color
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: When I select the "Dark" text color * Example #1: When I select the "Dark" section text color
* Example #2: And I select the "White" text color * Example #2: And I select the "White" section text color
* *
* @When I select the :arg1 text color * @When I select the :arg1 section text color
*/ */
public function iSelectTheTextColor($color) { public function iSelectTheSectionTextColor($color) {
$text_color = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$color') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-typography-text-color-text')]"); $this->iOpenTheSectionSettingsMenu("Typography");
$text_color->click(); $text_color = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$color') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-typography-text-color-text')]")->click();
} }
/** /**
...@@ -836,8 +872,8 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -836,8 +872,8 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
* @When I set the alignment to :arg1 * @When I set the alignment to :arg1
*/ */
public function iSetTheAlignmentTo($align) { public function iSetTheAlignmentTo($align) {
$alignment = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$align') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-typography-text-alignment')]"); $this->iOpenTheSectionSettingsMenu("Typography");
$alignment->click(); $alignment = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$align') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-typography-text-alignment')]")->click();
} }
/** /**
...@@ -851,8 +887,8 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -851,8 +887,8 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
* @When I set the horizontal alignment to :arg1 * @When I set the horizontal alignment to :arg1
*/ */
public function iSetTheHorizontalAlignmentTo($h_align) { public function iSetTheHorizontalAlignmentTo($h_align) {
$horizontal_alignment = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$h_align') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-alignment-horizontal-alignment-justify-content')]"); $this->iOpenTheSectionSettingsMenu("Blocks alignment");
$horizontal_alignment->click(); $horizontal_alignment = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$h_align') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-alignment-horizontal-alignment-justify-content')]")->click();
} }
/** /**
...@@ -866,196 +902,121 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -866,196 +902,121 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
* @When I set the vertical alignment to :arg1 * @When I set the vertical alignment to :arg1
*/ */
public function iSetTheVerticalAlignmentTo($v_align) { public function iSetTheVerticalAlignmentTo($v_align) {
$vertical_alignment = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$v_align') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-alignment-vertical-alignment-align-items')]"); $this->iOpenTheSectionSettingsMenu("Blocks alignment");
$vertical_alignment->click(); $vertical_alignment = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$v_align') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-alignment-vertical-alignment-align-items')]")->click();
} }
/** /**
* Set the padding for a section (all sides) * Set the padding for a section
*
* Varbase Context #varbase
*
* Example #1: When I set the padding to "5"
* Example #2: And I set the padding to "2"
*
* @When I set the padding to :arg1
*/
public function iSetThePaddingTo($padding) {
$this->getSession()->executeScript('jQuery(".bs-field-padding.form-range").val("' . $padding . '")');
}
/**
* Set the left padding for a section
*
* Varbase Context #varbase
*
* Example #1: When I set the left padding to "5"
* Example #2: And I set the left padding to "2"
*
* @When I set the left padding to :arg1
*/
public function iSetTheLeftPaddingTo($left_padding) {
$padding_left = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Padding left')]");
$padding_left->click();
$this->getSession()->executeScript('jQuery(".bs-field-padding-left.form-range").val("' . $left_padding . '")');
}
/**
* Set the right padding for a section
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: When I set the right padding to "5" * Example #1: When I set the section padding to "2"
* Example #2: And I set the right padding to "1" * Example #2: And I set the section "top" padding to "1"
* * Example #3: When I set the section "left" padding to "4"
* @When I set the right padding to :arg1 * Example #4: And I set the section right padding to 3
*/ * Example #5: And I set the section padding to 4
public function iSetTheRightPaddingTo($right_padding) {
$padding_right = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Padding right')]");
$padding_right->click();
$this->getSession()->executeScript('jQuery(".bs-field-padding-right.form-range").val("' . $right_padding . '")');
}
/**
* Set the top padding for a section
*
* Varbase Context #varbase
* *
* Example #1: When I set the top padding to "5" * @When I set the section :side padding to :value
* Example #2: And I set the top padding to "2" * @When I set the section padding to :value
*
* @When I set the top padding to :arg1
*/
public function iSetTheTopPaddingTo($top_padding) {
$padding_top = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Padding top')]");
$padding_top->click();
$this->getSession()->executeScript('jQuery(".bs-field-padding-top.form-range").val("' . $top_padding . '")');
}
/**
* Set the bottom padding for a section
*
* Varbase Context #varbase
*
* Example #1: When I set the bottom padding to "5"
* Example #2: And I set the bottom padding to "4"
*
* @When I set the bottom padding to :arg1
*/ */
public function iSetTheBottomPaddingTo($bottom_padding) { public function iSetTheSectionPaddingTo($side = NULL, $value) {
$padding_bottom = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Padding bottom')]"); $this->iOpenTheSectionSettingsMenu("Spacing");
$padding_bottom->click(); $padding_side = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Padding $side')]");
$this->getSession()->executeScript('jQuery(".bs-field-padding-bottom.form-range").val("' . $bottom_padding . '")'); if(is_null($side)){
$this->getSession()->executeScript('jQuery(".bs-field-padding.form-range").val("' . $value . '")');
}else{
$padding_side->click();
$js = <<<JS
var js_side = "$side";
var js_value = "$value";
jQuery(".bs-field-padding-" + js_side).val(js_value);
JS;
$this->getSession()->executeScript($js);
} }
}
/**
* Set the margin for a section (all sides)
*
* Varbase Context #varbase
*
* Example #1: When I set the margin to "5"
* Example #2: And I set the margin to "2"
*
* @When I set the margin to :arg1
*/
public function iSetTheMarginTo($margin) {
$this->getSession()->executeScript('jQuery(".bs-field-margin.form-range").val("' . $margin . '")');
}
/** /**
* Set the left margin for a section * Set the margin for a section
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: And I set the left margin to "2" * Example #1: When I set the section margin to "3"
* Example #2: When I set the left margin to "4" * Example #2: And I set the section "right" margin to "2"
* Example #3: When I set the section "top" margin to "1"
* Example #4: And I set the section left margin to 5
* Example #5: And I set the section margin to 4
* *
* @When I set the left margin to :arg1 * @When I set the section :side margin to :value
* @When I set the section margin to :value
*/ */
public function iSetTheLeftMarginTo($left_margin) { public function iSetTheSectionMarginTo($side = NULL, $value) {
$margin_left = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Margin left')]"); $this->iOpenTheSectionSettingsMenu("Spacing");
$margin_left->click(); $margin_side = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Margin $side')]");
$this->getSession()->executeScript('jQuery(".bs-field-margin-left.form-range").val("' . $left_margin . '")'); if(is_null($side)){
$this->getSession()->executeScript('jQuery(".bs-field-margin.form-range").val("' . $value . '")');
}else{
$margin_side->click();
$js = <<<JS
var js_side = "$side";
var js_value = "$value";
jQuery(".bs-field-margin-" + js_side).val(js_value);
JS;
$this->getSession()->executeScript($js);
} }
}
/**
* Set the top margin for a section
*
* Varbase Context #varbase
*
* Example #1: And I set the top margin to "2"
* Example #2: When I set the top margin to "4"
*
* @When I set the top margin to :arg1
*/
public function iSetTheTopMarginTo($top_margin)
{
$margin_top = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Margin top')]");
$margin_top->click();
$this->getSession()->executeScript('jQuery(".bs-field-margin-top.form-range").val("' . $top_margin . '")');
}
/** /**
* Set the right margin for a section * Select a border style for a section
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: And I set the right margin to "2" * Example #1: And I select the section "solid" border style
* Example #2: When I set the right margin to "4" * Example #2: And I select the section dashed border style
* Example #3: When I select the section "solid" "left" border style
* Example #4: And I select the section dotted top border style
* Example #5: When I select the section solid "bottom" border style
* *
* @When I set the right margin to :arg1 * @When I select the section :b_style border style
* @When I select the section :b_style :b_side border style
*/ */
public function iSetTheRightMarginTo($right_margin) public function iSelectTheSectionBorderStyle($b_style, $b_side = NULL) {
{ $this->iOpenTheSectionSettingsMenu("Border");
$margin_right = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Margin right')]"); if(is_null($b_side)){
$margin_right->click(); $this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-border-border-style-bs-border-style-$b_style')]")->click();
$this->getSession()->executeScript('jQuery(".bs-field-margin-right.form-range").val("' . $right_margin . '")'); }else{
$this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-border-border-type-border-$b_side')]")->click();
$this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-border-border-$b_side-style-bs-border-style-$b_side-$b_style')]")->click();
} }
/**
* Set the bottom margin for a section
*
* Varbase Context #varbase
*
* Example #1: And I set the bottom margin to "2"
* Example #2: When I set the bottom margin to "4"
*
* @When I set the bottom margin to :arg1
*/
public function iSetTheBottomMarginTo($bottom_margin) {
$margin_bottom = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Margin bottom')]");
$margin_bottom->click();
$this->getSession()->executeScript('jQuery(".bs-field-margin-bottom.form-range").val("' . $bottom_margin . '")');
}
/**
* Select a border style
*
* Varbase Context #varbase
*
* Example #1: And I select the "Solid" border style
* Example #2: When I select the "Dotted" border style
*
* @When I select the :arg1 border style
*/
public function iSelectTheBorderStyle($b_style) {
$border_style = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$b_style') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-border-border-style-bs-border-style')]");
$border_style->click();
} }
/** /**
* Set the border width * Set the border width for a section
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: When I set the border width to "3" * Example #1: When I set the section border width to "3"
* Example #2: And I set the border width to "2" * Example #2: And I set the section top border width to "2"
* Example #3: When I set the section left border width to 1
* *
* @When I set the border width to :arg1 * @When I set the section border width to :b_width
* @When I set the section :b_side border width to :b_width
*/ */
public function iSetTheBorderWidthTo($b_width) { public function iSetTheSectionBorderWidthTo($b_width, $b_side = NULL) {
$border_width = $this->getSession()->getPage()->find('xpath', "//label[contains(., 'Border width')]"); $this->iOpenTheSectionSettingsMenu("Border");
$this->getSession()->executeScript('jQuery(".bs-field-border-width.form-range").val("' . $b_width . '")'); if(is_null($b_side)){
$this->getSession()->executeScript('jQuery(".bs-field-border-width.form-range").val("' . $b_width . '")');
}else{
$this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-border-border-type-border-$b_side')]")->click();
$js = <<<JS
var js_side = "$b_side";
var js_width = "$b_width";
jQuery(".bs-field-border-width-" + js_side).val(js_width);
JS;
$this->getSession()->executeScript($js);
}
} }
/** /**
...@@ -1063,139 +1024,67 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -1063,139 +1024,67 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: And I select the "Dark" border color * Example #1: And I select the section "Dark" border color
* Example #2: When I select the "Primary" border color * Example #2: When I select the section "Primary" border color
* * Example #3: And I select the section "Danger" top border color
* @When I select the :arg1 border color * Example #4: When I select the section "Info" right border color
*/
public function iSelectTheBorderColor($b_color) {
$border_color = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$b_color') and contains (@for, 'edit-layout-settings-ui-tab-content-appearance-border-border-color-border')]");
$border_color->click();
}
/**
* Set the border radius value
*
* Varbase Context #varbase
*
* Example #1: When I set the border radius to "2"
* Example #2: And I set the border radius to "3"
*
* @When I set the border radius to :arg1
*/
public function iSetTheBorderRadiusTo($b_radius) {
$border_radius = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Corners')]");
$this->getSession()->executeScript('jQuery(".bs-field-rounded-corners.form-range").val("' . $b_radius . '")');
}
/**
* Set the top left border radius value
*
* Varbase Context #varbase
*
* Example #1: When I set the top left border radius to "1"
* Example #2: And I set the top left border radius to "2"
*
* @When I set the top left border radius to :arg1
*/
public function iSetTheTopLeftBorderRadiusTo($b_radius_top_left) {
$border_radius_top_left = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Top Left')]");
$this->getSession()->executeScript('jQuery(".bs-field-rounded-corner-top_left.form-range").val("' . $b_radius_top_left . '")');
}
/**
* Set the top right border radius value
*
* Varbase Context #varbase
*
* Example #1: And I set the top right border radius to "3"
* Example #2: When I set the top right border radius to "1"
* *
* @When I set the top right border radius to :arg1 * @When I select the section :b_color border color
* @When I select the section :b_color :b_side border color
*/ */
public function iSetTheTopRightBorderRadiusTo($b_radius_top_right) { public function iSelectTheSectionBorderColor($b_color, $b_side = NULL) {
$border_radius_top_right = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Top Right')]"); $this->iOpenTheSectionSettingsMenu("Border");
$this->getSession()->executeScript('jQuery(".bs-field-rounded-corner-top_right.form-range").val("' . $b_radius_top_right . '")'); if(is_null($b_side)){
} $this->getSession()->getPage()->find('xpath', "//label[contains(.,'$b_color') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-border-border-color-border')]")->click();
}else{
/** $this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-border-border-type-border-$b_side')]")->click();
* Set the bottom left border radius value $this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-border-border-$b_side') and contains(.,'$b_color')]")->click();
* }
* Varbase Context #varbase
*
* Example #1: And I set the bottom left border radius to "3"
* Example #2: When I set the bottom left border radius to "1"
*
* @When I set the bottom left border radius to :arg1
*/
public function iSetTheBottomLeftBorderRadiusTo($b_radius_bottom_left) {
$border_radius_bottom_left = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Bottom Left')]");
$this->getSession()->executeScript('jQuery(".bs-field-rounded-corner-bottom_left.form-range").val("' . $b_radius_bottom_left . '")');
}
/**
* Set the bottom right border radius value
*
* Varbase Context #varbase
*
* Example #1: And I set the bottom right border radius to "3"
* Example #2: When I set the bottom right border radius to "1"
*
* @When I set the bottom right border radius to :arg1
*/
public function iSetTheBottomRightBorderRadiusTo($b_radius_bottom_right) {
$border_radius_bottom_right = $this->getSession()->getPage()->find('xpath', "//*[contains(., 'Bottom Right')]");
$this->getSession()->executeScript('jQuery(".bs-field-rounded-corner-bottom_right.form-range").val("' . $b_radius_bottom_right . '")');
} }
/** /**
* Set the left border style * Set the border radius
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: When I select the "Dotted" left border style * Example #1: When I set the section border radius to 2
* Example #2: And I select the "Dashed" left border style * Example #2: And I set the section border radius to "2"
* Example #3: And I set the section "top left" border radius to 2
* Example #4: When I set the section "bottom right" border radius to "3"
* Example #5: And I set the section top right border radius to 1
* *
* @When I select the :arg1 left border style * @When I set the section border radius to :value
* @When I set the section :corner border radius to :value
*/ */
public function iSelectTheLeftBorderStyle($b_left_style) { public function iSetTheSectionBorderRadiusTo($corner = NULL, $value) {
$left_border_side = $this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-border-border-type-border-left')]"); $this->iOpenTheSectionSettingsMenu("Border");
$left_border_side->click(); if(is_null($corner)){
$left_border_style = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$b_left_style') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-border-border-left-style-bs-border-style')]"); $this->getSession()->executeScript('jQuery(".bs-field-rounded-corners").val("' . $value . '")');
$left_border_style->click(); }else{
$js = <<<JS
var js_corner = "$corner";
var js_value = "$value";
js_corner = js_corner.replace(' ', '_');
jQuery(".bs-field-rounded-corner-" + js_corner).val(js_value);
JS;
$this->getSession()->executeScript($js);
}
} }
/**
* Set the left border width
*
* Varbase Context #varbase
*
* Example #1: When I set the left border width to "1"
* Example #2: And I set the left border width to "2"
*
* @When I set the left border width to :arg1
*/
public function iSetTheLeftBorderWidthTo($b_left_width) {
$left_border_side = $this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-border-border-type-border-left')]");
$left_border_side->click();
$border_width = $this->getSession()->getPage()->find('xpath', "//label[contains(., 'Border left width')]");
$this->getSession()->executeScript('jQuery(".bs-field-border-width-left.form-range").val("' . $b_left_width . '")');
}
/** /**
* Switch to the background image settings found under background styles settings * Switch to the background image settings found under background styles settings
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: And I switch to background image settings * Example #1: And I switch to section background image settings
* *
* @When I switch to background image settings * @When I switch to background image settings
*/ */
public function iSwitchToBackgroundImageSettings() { public function iSwitchToSectionBackgroundImageSettings() {
// $menu = $this->getSession()->getPage()->find('xpath', "//span[contains(., 'Background') and contains(@class, 'bs-group-title')]"); $this->iOpenTheSectionSettingsMenu("Background");
// $menu->click(); $bg_image = $this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-background-background-type-image')]")->click();
$bg_image = $this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-background-background-type-image')]");
$bg_image->click();
} }
/** /**
...@@ -1203,13 +1092,13 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -1203,13 +1092,13 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Exmaple #1: And I switch to background video settings * Exmaple #1: And I switch to section background video settings
* *
* @When I switch to background video settings * @When I switch to section background video settings
*/ */
public function iSwitchToBackgroundVideoSettings() { public function iSwitchToSectionBackgroundVideoSettings() {
$bg_video = $this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-background-background-type-video')]"); $this->iOpenTheSectionSettingsMenu("Background");
$bg_video->click(); $bg_video = $this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-background-background-type-video')]")->click();
} }
/** /**
...@@ -1221,10 +1110,8 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -1221,10 +1110,8 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
* *
* @When I set the attachment to be fixed * @When I set the attachment to be fixed
*/ */
public function iSetTheAttachmentToBeFixed() public function iSetTheAttachmentToBeFixed() {
{ $fixed_image = $this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-background-background-options-background-attachment-fixed')]")->click();
$fixed_image = $this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-background-background-options-background-attachment-fixed')]");
$fixed_image->click();
} }
/** /**
...@@ -1237,27 +1124,46 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -1237,27 +1124,46 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
* *
* @When I set the image size to :arg1 * @When I set the image size to :arg1
*/ */
public function iSetTheImageSizeTo($arg1) public function iSetTheImageSizeTo($arg1) {
{ $image_size = $this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-background-background-options-background-size') and contains(., '$arg1')]")->click();
$image_size = $this->getSession()->getPage()->find('xpath', "//label[contains(@for, 'edit-layout-settings-ui-tab-content-appearance-background-background-options-background-size') and contains(., '$arg1')]");
$image_size->click();
} }
/** /**
* Select an animation for a section * Select an animation for a section
* *
* Varbase Context #varbase * Varbase Context #varbase
* *
* Example #1: When I select the "Flip Right" animation * Example #1: When I select the section "Flip Right" animation
* Example #2: And I select the "Zoom Out" animation * Example #2: And I select the section "Zoom Out" animation
* *
* @When I select the :arg1 animation * @When I select the section :arg1 animation
*/ */
public function iSelectTheAnimation($anime) { public function iSelectTheSectionAnimation($anime) {
$animation = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$anime') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-animation-scroll-effects')]"); $this->iOpenTheSectionSettingsMenu("Animation");
$animation->click(); $animation = $this->getSession()->getPage()->find('xpath', "//label[contains(., '$anime') and contains(@for, 'edit-layout-settings-ui-tab-content-appearance-animation-scroll-effects')]")->click();
} }
/**
* Add a block to a section
*
* Varbase Context #varbase
*
* Example #1: And I add a Heading block
* Example #2: When I add a "HTML code" block
* Example #3: And I add a "Rich text" block
*
* @When I add a :block block
*/
public function iAddABlock($block)
{
$add_block_btn = $this->getSession()->getPage()->find('xpath', "//*[contains(@class, 'use-ajax layout-builder__link layout-builder__link--add') and contains(., 'Add block')]")->click();
$this->iWaitForSeconds(1);
$custom_block_btn = $this->getSession()->getPage()->find('xpath', "//*[contains(@class, 'use-ajax inline-block-create-button') and contains(., 'Create custom block')]")->click();
$this->iWaitForSeconds(1);
$block = $this->getSession()->getPage()->find('xpath', "//*[contains(@class, 'use-ajax js-layout-builder-block-link inline-block-list__item') and contains(., '$block')]")->click();
}
/** /**
* Images Functions. * Images Functions.
* *
...@@ -1650,7 +1556,7 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -1650,7 +1556,7 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
*/ */
public function iShouldSeeValueInTheInputElement($text, $selector) { public function iShouldSeeValueInTheInputElement($text, $selector) {
$elements = $this->getSession()->getPage()->findAll('xpath', "//*[@id='{$selector}']"); $elements = $this->getSession()->getPage()->findAll('xpath', "//*[@data-drupal-selector='{$selector}']");
if (empty($elements)) { if (empty($elements)) {
throw new \Exception(sprintf('The input element "%s" was not found in the page', $selector)); throw new \Exception(sprintf('The input element "%s" was not found in the page', $selector));
} }
...@@ -1671,6 +1577,7 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext ...@@ -1671,6 +1577,7 @@ class VarbaseContext extends RawDrupalContext implements SnippetAcceptingContext
} }
} }
/** /**
* Check if we can click a value in the input element. * Check if we can click a value in the input element.
* *
...@@ -2204,7 +2111,7 @@ JS; ...@@ -2204,7 +2111,7 @@ JS;
* @When /^(?:|I )scroll to (?:|the )bottom(?:| of the page)$/ * @When /^(?:|I )scroll to (?:|the )bottom(?:| of the page)$/
*/ */
public function iScrollToBottom() { public function iScrollToBottom() {
$this->getSession()->executeScript("javascript:window.scrollBy(0,document.body.scrollHeight)"); $this->getSession()->executeScript("window.scrollTo(0,document.body.scrollHeight)");
} }
/** /**
......
tests/features/varbase/04-content-structure/04-08-landing-page-layout-builder_check-to-add-sections-and-choose-layouts-for-sections.feature
+ 10
− 33
View file @ 5632f88b
...@@ -64,13 +64,8 @@ So that the "Landing (Layout Builder) page" will show up having the listed secti ...@@ -64,13 +64,8 @@ So that the "Landing (Layout Builder) page" will show up having the listed secti
When I scroll to the bottom of the page When I scroll to the bottom of the page
And I wait 2s And I wait 2s
Then I should see "Add section at end of layout" Then I should see "Add section at end of layout"
When I click "Add section at end of layout" When I add a basic section at the end of layout
And I wait for AJAX to finish And I save the section
Then I should see "Choose a layout for this section"
And I should see "Bootstrap 1 Col"
When I click "Bootstrap 1 Col"
And I wait for AJAX to finish
And I press the "Add section" button
And I wait for AJAX to finish And I wait for AJAX to finish
Then I should see "Add block in Section 2, Col 1 region" Then I should see "Add block in Section 2, Col 1 region"
...@@ -121,13 +116,10 @@ So that the "Landing (Layout Builder) page" will show up having the listed secti ...@@ -121,13 +116,10 @@ So that the "Landing (Layout Builder) page" will show up having the listed secti
When I scroll to the bottom of the page When I scroll to the bottom of the page
And I wait 2s And I wait 2s
Then I should see "Add section at end of layout" Then I should see "Add section at end of layout"
When I click "Add section at end of layout" When I add a basic "2 Cols" section at the end of layout
And I wait for AJAX to finish And I wait for AJAX to finish
Then I should see "Choose a layout for this section" And I save the section
And I should see "Bootstrap 2 Cols"
When I click "Bootstrap 2 Cols"
And I wait for AJAX to finish And I wait for AJAX to finish
And I press the "Add section" button
Then I should see "Add block in Section 3, Col 1 region" Then I should see "Add block in Section 3, Col 1 region"
And I should see "Add block in Section 3, Col 2 region" And I should see "Add block in Section 3, Col 2 region"
...@@ -195,13 +187,8 @@ So that the "Landing (Layout Builder) page" will show up having the listed secti ...@@ -195,13 +187,8 @@ So that the "Landing (Layout Builder) page" will show up having the listed secti
When I scroll to the bottom of the page When I scroll to the bottom of the page
And I wait 2s And I wait 2s
Then I should see "Add section at end of layout" Then I should see "Add section at end of layout"
When I click "Add section at end of layout" When I add a basic "3 Cols" section at the end of layout
And I wait for AJAX to finish And I save the section
Then I should see "Choose a layout for this section"
And I should see "Bootstrap 3 Cols"
When I click "Bootstrap 3 Cols"
And I wait for AJAX to finish
And I press the "Add section" button
And I wait for AJAX to finish And I wait for AJAX to finish
Then I should see "Add block in Section 4, Col 1 region" Then I should see "Add block in Section 4, Col 1 region"
And I should see "Add block in Section 4, Col 2 region" And I should see "Add block in Section 4, Col 2 region"
...@@ -288,13 +275,8 @@ So that the "Landing (Layout Builder) page" will show up having the listed secti ...@@ -288,13 +275,8 @@ So that the "Landing (Layout Builder) page" will show up having the listed secti
When I scroll to the bottom of the page When I scroll to the bottom of the page
And I wait 2s And I wait 2s
Then I should see "Add section at end of layout" Then I should see "Add section at end of layout"
When I click "Add section at end of layout" When I add a basic "4 Cols" section at the end of layout
And I wait for AJAX to finish And I save the section
Then I should see "Choose a layout for this section"
And I should see "Bootstrap 4 Cols"
When I click "Bootstrap 4 Cols"
And I wait for AJAX to finish
And I press the "Add section" button
And I wait for AJAX to finish And I wait for AJAX to finish
Then I should see "Add block in Section 5, Col 1 region" Then I should see "Add block in Section 5, Col 1 region"
And I should see "Add block in Section 5, Col 2 region" And I should see "Add block in Section 5, Col 2 region"
...@@ -399,13 +381,8 @@ So that the "Landing (Layout Builder) page" will show up having the listed secti ...@@ -399,13 +381,8 @@ So that the "Landing (Layout Builder) page" will show up having the listed secti
When I scroll to the bottom of the page When I scroll to the bottom of the page
And I wait 2s And I wait 2s
Then I should see "Add section at end of layout" Then I should see "Add section at end of layout"
When I click "Add section at end of layout" When I add a basic "6 Cols" section at the end of layout
And I wait for AJAX to finish And I save the section
Then I should see "Choose a layout for this section"
And I should see "Bootstrap 6 Cols"
When I click "Bootstrap 6 Cols"
And I wait for AJAX to finish
And I press the "Add section" button
And I wait for AJAX to finish And I wait for AJAX to finish
Then I should see "Add block in Section 6, Col 1 region" Then I should see "Add block in Section 6, Col 1 region"
And I should see "Add block in Section 6, Col 2 region" And I should see "Add block in Section 6, Col 2 region"
......
tests/features/varbase/04-content-structure/04-10-landing-page-section-configurations.feature
+ 8
− 18
View file @ 5632f88b
...@@ -18,29 +18,19 @@ As a site admin, I will create a new landing page, add a section with different ...@@ -18,29 +18,19 @@ As a site admin, I will create a new landing page, add a section with different
And I wait 1s And I wait 1s
Then I should see "Add section at end of layout" Then I should see "Add section at end of layout"
When I click "Add section at end of layout" When I add a basic "2 Cols" section at the end of layout
And I wait for AJAX to finish And I select the "Boxed" container type with a "Tiny" width
Then I should see "Bootstrap 2 Cols" And I select the "md" "33% 67%" section breakpoint
When I click "Bootstrap 2 Cols" And I add section gutters
And I wait for AJAX to finish
And I select the "Boxed" container type
And I wait for AJAX to finish
Then I should see "Container width"
When I select the "Tiny" container width
And I select the "md" "33% 67%" breakpoint
And I add gutters
Then I should not see "Keep gutters between columns" Then I should not see "Keep gutters between columns"
When I move to the styles tab
And I wait for AJAX to finish And I wait for AJAX to finish
And I open the "Background" settings menu And I select the "Primary" section background color
And I wait for AJAX to finish
And I select the "Primary" background color
And I uncheck the Edge to Edge Background And I uncheck the Edge to Edge Background
And I open the "Typography" settings menu And I select the "White" section text color
And I select the "White" text color
And I set the alignment to "End" And I set the alignment to "End"
And I press the "Add section" button And I save the section
And I wait for AJAX to finish
Then I should see "Add block in Section 2, Col 1 region" Then I should see "Add block in Section 2, Col 1 region"
When I scroll to the bottom of the page When I scroll to the bottom of the page
......
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment