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

[MWPW-140873] Refactor automation test scripts #233

Merged
merged 7 commits into from
Jan 3, 2024
+437 −628
Merged

[MWPW-140873] Refactor automation test scripts #233

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
7 commits
Select commit Hold shift + click to select a range
533ba56
update quote block
nateekar Dec 15, 2023
197ead5
update
nateekar Dec 15, 2023
856a8be
column blocks refactor
nateekar Dec 21, 2023
771f850
howto blocks refactor
nateekar Dec 21, 2023
7cb0d43
rm space
nateekar Dec 21, 2023
92f0ee2
zpattern block test
nateekar Dec 30, 2023
ab4c311
update html extn
nateekar Jan 3, 2024
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
124 changes: 2 additions & 122 deletions selectors/milo/columns.block.page.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,10 +2,10 @@ import { expect } from '@playwright/test';
import { WebUtil } from '../../libs/webutil.js';

export default class Columns {
constructor(page) {
constructor(page, nth = 0) {
this.page = page;
// columns locators
this.column = this.page.locator('.columns');
this.column = this.page.locator('.columns').nth(nth);
this.rows = this.column.locator('.row');
this.columns = this.column.locator('.col');

Expand Down Expand Up @@ -52,124 +52,4 @@ export default class Columns {
'columns-contained-table': { 'class': 'columns contained columns-table' },
};
}

/**
* Verifies the visibility, css, attributes, styles, of elements or sections of
* the specified Columns block.
* @param {string} columnType - The type of the Columns block to verify.
* Possible values are 'columns', 'columns (contained)', 'columns (contained,middle)',and
* columns (table),columns (contained,table),
* @returns {Promise<boolean>} - Returns true if the specified Column type has the expected values.
*/
async verifyColumns(columnType, data) {
// verify column block is visible
await expect(await this.column).toBeVisible();

// verify rows and columns count
await expect(await this.rows).toHaveCount(data.rows);
await expect(await this.columns).toHaveCount(data.columns);

// verify columns text
await expect(await this.columns.nth(0)).toContainText(data.col0);
await expect(await this.columns.nth(1)).toContainText(data.col1);

// verify the css of columns row
if (!columnType.includes('table')) {
expect(await WebUtil.verifyCSS(
await this.rows.nth(0),
this.cssProperties['.columns > .row'],
)).toBeTruthy();
}

switch (columnType) {
case 'columns':
// verify the attributes of columns type block
expect(await WebUtil.verifyAttributes(
await this.column,
this.attProperties.columns,
)).toBeTruthy();
// verify third column content
await expect(await this.columns.nth(2)).toContainText(data.col2);
return true;

case 'columns(contained)':
// verify the attributes of columns type block
expect(await WebUtil.verifyAttributes(
await this.column,
this.attProperties['columns-contained'],
)).toBeTruthy();

// verify the css of columns row
expect(await WebUtil.verifyCSS(
await this.column.nth(0),
this.cssProperties['.columns.contained'],
)).toBeTruthy();

return true;

case 'columns(contained,middle)':
// verify the attributes of columns type block
expect(await WebUtil.verifyAttributes(
await this.column,
this.attProperties['columns-contained-middle'],
)).toBeTruthy();

// verify the css of columns row
expect(await WebUtil.verifyCSS(
await this.column.nth(0),
this.cssProperties['.columns.contained'],
)).toBeTruthy();
return true;

case 'columns(table)':
// verify the attributes of columns type block
expect(await WebUtil.verifyAttributes(
await this.column,
this.attProperties['columns-table'],
)).toBeTruthy();

// verify the css of columns first row
expect(await WebUtil.verifyCSS(
await this.rows.nth(0),
this.cssProperties['.columns.table > .row:first-child'],
)).toBeTruthy();

expect(await WebUtil.verifyCSS(
await this.rows.nth(1),
this.cssProperties['.columns.table > .row'],
)).toBeTruthy();

// verify columns text
await expect(await this.columns.nth(2)).toContainText(data.col2);
await expect(await this.columns.nth(3)).toContainText(data.col3);

return true;

case 'columns(contained,table)':
// verify the attributes of columns type block
expect(await WebUtil.verifyAttributes(
await this.column,
this.attProperties['columns-contained-table'],
)).toBeTruthy();

// verify the css of columns first row
expect(await WebUtil.verifyCSS(
await this.rows.nth(0),
this.cssProperties['.columns.table > .row:first-child'],
)).toBeTruthy();

expect(await WebUtil.verifyCSS(
await this.rows.nth(1),
this.cssProperties['.columns.table > .row'],
)).toBeTruthy();

// verify columns text
await expect(await this.columns.nth(2)).toContainText(data.col2);
await expect(await this.columns.nth(3)).toContainText(data.col3);

return true;
default:
throw new Error(`Unsupported Text type: ${this.columnsType}`);
}
}
}
63 changes: 9 additions & 54 deletions selectors/milo/howto.block.page.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,18 +1,15 @@
import { expect } from '@playwright/test';
import { WebUtil } from '../../libs/webutil.js';

export default class HowTo {
constructor(page) {
constructor(page, nth = 0) {
this.page = page;
// how-to locators
this.howTo = page.locator('.how-to');
this.howToForeground = this.howTo.locator('.foreground');
this.howToLarge = this.page.locator('.how-to.large-image');
this.howToSeo = this.page.locator('.how-to.seo');
this.howToHeading = this.howTo.locator('.how-to-heading');
this.howToImage = this.howTo.locator('.how-to-image');
this.howToList = this.howTo.locator('li');
this.howToLargeImage = page.locator('.how-to-image img');
this.howTo = page.locator('.how-to').nth(nth);
this.foreground = this.howTo.locator('.foreground');
this.howToLarge = this.page.locator('.how-to.large-image').nth(nth);
this.howToSeo = this.page.locator('.how-to.seo').nth(nth);
this.heading = this.howTo.locator('.how-to-heading');
this.image = this.howTo.locator('.how-to-image');
this.list = this.howTo.locator('li');
this.largeImage = page.locator('.how-to-image img');

// howto contents css
this.cssProperties = {
Expand Down Expand Up @@ -50,48 +47,6 @@ export default class HowTo {
'width': '600',
'height': '300',
},

};
}

/**
* Verifies the css, attributes, styles, of elements or sections of the specified HowTo block.
*
* @param {string} howToType - The type of the HowTo to verify.
* Possible values are 'how-to', 'how-to (large-image)', and 'how-to (seo)'.
* @param {Integer} howToListCount - Howto block list count (ex: 3, 4, 5 etc..).
* @returns {Promise<boolean>} - Returns true if the specified HowTo type has the expected values.
*/
async verifyHowTo(howToType, howToListCount) {
switch (howToType) {
case 'how-to':
// verify howto visibility and css values
await expect(this.howTo).toBeVisible();
expect(await WebUtil.verifyCSS(this.howToForeground, this.cssProperties['.how-to .foreground'])).toBeTruthy();
expect(await WebUtil.verifyCSS(this.howToHeading, this.cssProperties['body-m'])).toBeTruthy();
expect(await WebUtil.verifyCSS(this.howToImage, this.cssProperties['how-to-image'])).toBeTruthy();
// verify howto list count
await expect(await this.howToList).toHaveCount(howToListCount);
return true;
case 'how-to (large)':
// verify howto large visibility and css values
await expect(this.howToLarge).toBeVisible();
expect(await WebUtil.verifyCSS(this.howToHeading, this.cssProperties['body-m'])).toBeTruthy();
expect(await WebUtil.verifyCSS(this.howToLarge, this.cssProperties['how-to-large-image'])).toBeTruthy();
expect(await WebUtil.verifyAttributes(await this.howToLargeImage, this.attProperties['how-to-large-image'])).toBeTruthy();
// verify howto list count
await expect(await this.howToList).toHaveCount(howToListCount);
return true;
case 'how-to (seo)':
// verify howto seo visibility and css values
await expect(this.howToSeo).toBeVisible();
expect(await WebUtil.verifyCSS(this.howToHeading, this.cssProperties['body-m'])).toBeTruthy();
expect(await WebUtil.verifyCSS(this.howToSeo, this.cssProperties['how-to-seo'])).toBeTruthy();
// verify howto list count
await expect(await this.howToList).toHaveCount(howToListCount);
return true;
default:
throw new Error(`Unsupported howto type: ${this.howToList}`);
}
}
};
116 changes: 2 additions & 114 deletions selectors/milo/quote.block.page.js
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,11 +1,8 @@
import { expect } from '@playwright/test';
import { WebUtil } from '../../libs/webutil.js';

export default class Quote {
constructor(page) {
constructor(page, nth = 0) {
this.page = page;
// quote locators
this.quote = this.page.locator('.quote');
this.quote = this.page.locator('.quote').nth(nth);
this.quoteImage = this.quote.locator('.quote-image');
this.quoteCopy = this.quote.locator('p.quote-copy');
this.quoteFigCaption = this.quote.locator('p.figcaption');
Expand Down Expand Up @@ -62,115 +59,6 @@ export default class Quote {
'quote-align-right': { 'class': 'quote contained align-right con-block' },
'quote-xl-spacing': { 'class': 'quote contained xl-spacing con-block' },
'section-dark': { 'style': 'background: rgb(102, 102, 102);' },

};
}

/**
* Verifies the visibility, css, attributes, styles, of elements or sections of
* the specified Quote block.
*
* @param {string} quoteType - The type of the Quote block to verify.
* Possible values are 'quote', 'quote (contained)', 'quote (inline)'.
* quote (borders), quote (align-right), and quote (xl-spaced)
* @returns {Promise<boolean>} - Returns true if the specified Quote type has the expected values.
*/
async verifyQuote(quoteType, data) {
await expect(await this.quote).toBeVisible();

switch (quoteType) {
case 'quote':
// verify quote block image visibility, attributes, css and different contents
await expect(await this.quoteImage).toBeVisible();
expect(await WebUtil.verifyAttributes(
await this.quote,
this.attProperties.quote,
)).toBeTruthy();
expect(await WebUtil.verifyCSS(await this.quote, this.cssProperties.quote)).toBeTruthy();
await expect(await this.quoteCopy).toContainText(data.quoteCopy);
await expect(await this.quoteFigCaption).toContainText(data.figCaption);
await expect(await this.quoteFigCaptionCite).toContainText(data.cite);

return true;
case 'quote (contained)':
// verify quote (contained) block image visibility, attributes, css and different contents
await expect(await this.quoteImage).toBeVisible();
expect(await WebUtil.verifyAttributes(
await this.quote,
this.attProperties['quote-contained'],
)).toBeTruthy();
expect(await WebUtil.verifyCSS(await this.quote, this.cssProperties['quote-contained'])).toBeTruthy();
await expect(await this.quoteCopy).toContainText(data.quoteCopy);
await expect(await this.quoteFigCaption).toContainText(data.figCaption);
await expect(await this.quoteFigCaptionCite).toContainText(data.cite);

return true;

case 'quote (inline)':
// verify quote (inline) block image visibility, attributes, css and different contents
await expect(await this.quoteImage).toBeVisible();
expect(await WebUtil.verifyAttributes(
await this.quote,
this.attProperties['quote-inline'],
)).toBeTruthy();
expect(await WebUtil.verifyCSS(await this.quote, this.cssProperties.quote)).toBeTruthy();
expect(await WebUtil.verifyCSS(await this.quoteImage, this.cssProperties['quote-inline-figure'])).toBeTruthy();
await expect(await this.quoteCopy).toContainText(data.quoteCopy);
await expect(await this.quoteFigCaption).toContainText(data.figCaption);
await expect(await this.quoteFigCaptionCite).toContainText(data.cite);

return true;

case 'quote (borders)':
// verify quote (borders) block image not visibility, attributes, css and different contents
await expect(await this.quoteImage).not.toBeVisible();
expect(await WebUtil.verifyAttributes(
await this.quote,
this.attProperties['quote-borders'],
)).toBeTruthy();
expect(await WebUtil.verifyCSS(await this.quote, this.cssProperties.quote)).toBeTruthy();
await expect(await this.quoteCopy).toContainText(data.quoteCopy);
await expect(await this.quoteFigCaption).toContainText(data.figCaption);
await expect(await this.quoteFigCaptionCite).toContainText(data.cite);

return true;

case 'quote (align-right)':
// verify quote (align-right) block image visibility, attributes, css and different content
await expect(await this.quoteImage).toBeVisible();
expect(await WebUtil.verifyAttributes(
await this.quote,
this.attProperties['quote-align-right'],
)).toBeTruthy();
expect(await WebUtil.verifyCSS(await this.quote, this.cssProperties['quote-align-right'])).toBeTruthy();
await expect(await this.quoteCopy).toContainText(data.quoteCopy);
await expect(await this.quoteFigCaption).toContainText(data.figCaption);
await expect(await this.quoteFigCaptionCite).toContainText(data.cite);

return true;

case 'quote (xl-spaced)':
// verify quote (xl-spaced) block image visibility, attributes, css and different content
await expect(await this.sectionDark).toBeVisible();
expect(await WebUtil.verifyAttributes(
await this.sectionDark,
this.attProperties['section-dark'],
)).toBeTruthy();

await expect(await this.quoteImage).not.toBeVisible();
expect(await WebUtil.verifyAttributes(
await this.quote,
this.attProperties['quote-xl-spacing'],
)).toBeTruthy();

expect(await WebUtil.verifyCSS(await this.quote, this.cssProperties.quote)).toBeTruthy();
await expect(await this.quoteCopy).toContainText(data.quoteCopy);
await expect(await this.quoteFigCaption).toContainText(data.figCaption);
await expect(await this.quoteFigCaptionCite).toContainText(data.cite);

return true;
default:
throw new Error(`Unsupported Text type: ${this.quoteType}`);
}
}
}
Loading
Loading