diff --git a/.github/workflows/test.yml-template b/.github/workflows/test.yml-template
new file mode 100644
index 0000000000..8b5743ecb4
--- /dev/null
+++ b/.github/workflows/test.yml-template
@@ -0,0 +1,29 @@
+name: Test
+
+on:
+ pull_request:
+ branches: [ master ]
+
+jobs:
+ build:
+
+ runs-on: ubuntu-latest
+
+ strategy:
+ matrix:
+ node-version: [20.x]
+
+ steps:
+ - uses: actions/checkout@v2
+ - name: Use Node.js ${{ matrix.node-version }}
+ uses: actions/setup-node@v1
+ with:
+ node-version: ${{ matrix.node-version }}
+ - run: npm install
+ - run: npm test
+ - name: Upload HTML report(backstop data)
+ if: ${{ always() }}
+ uses: actions/upload-artifact@v2
+ with:
+ name: report
+ path: backstop_data
diff --git a/backstopConfig.js b/backstopConfig.js
deleted file mode 100644
index 8f0fd08bd3..0000000000
--- a/backstopConfig.js
+++ /dev/null
@@ -1,78 +0,0 @@
-'use strict';
-// https://github.com/garris/BackstopJS#advanced-scenarios
-
-const backstop = require('@mate-academy/backstop-config');
-const { basicScenario } = backstop;
-
-const basic = {
- ...basicScenario,
- label: 'Elementary test',
- referenceUrl: basicScenario.referenceUrl + '/catalog/',
-};
-
-const config = {
- ...backstop,
- fileNameTemplate: '{scenarioLabel}_{viewportLabel}',
- onBeforeScript: 'puppet/onBefore.js',
- onReadyScript: 'puppet/onReady.js',
- viewports: [
- {
- name: '1024px',
- width: 1024,
- height: 768,
- },
- {
- name: '1200px',
- width: 1200,
- height: 768,
- },
- ],
- scenarios: [
- {
- ...basic,
- label: 'Entire document',
- selectors: ['document'],
- },
- {
- ...basic,
- label: 'Header tag',
- selectors: ['header'],
- },
- {
- ...basic,
- label: 'Nav tag',
- selectors: ['nav'],
- },
- {
- ...basic,
- label: 'Link with data-qa_hover',
- selectors: ['[data-qa="nav-hover"]'],
- hoverSelector: '[data-qa="nav-hover"]',
- postInteractionWait: 1000,
- },
- {
- ...basic,
- label: 'Link with class_is-active',
- selectors: ['a.is-active'],
- },
- {
- ...basic,
- label: 'Main tag',
- selectors: ['main'],
- },
- {
- ...basic,
- label: 'Card with data-qa_card',
- selectors: ['[data-qa="card"]'],
- },
- // {
- // ...basic,
- // label: 'Card with data-qa_card-hover',
- // selectors: ['[data-qa="card"]'],
- // hoverSelector: '[data-qa="card-hover"]',
- // postInteractionWait: 1000,
- // },
- ],
-};
-
-module.exports = config;
diff --git a/backstop_data/engine_scripts/cookies.json b/backstop_data/engine_scripts/cookies.json
index b59400d7e6..4123a5d695 100644
--- a/backstop_data/engine_scripts/cookies.json
+++ b/backstop_data/engine_scripts/cookies.json
@@ -9,6 +9,6 @@
"httpOnly": false,
"secure": false,
"session": false,
- "sameSite": "no_restriction"
+ "sameSite": "Lax"
}
]
diff --git a/backstop_data/engine_scripts/puppet/clickAndHoverHelper.js b/backstop_data/engine_scripts/puppet/clickAndHoverHelper.js
index 6c1e1b8841..703d3b89b2 100644
--- a/backstop_data/engine_scripts/puppet/clickAndHoverHelper.js
+++ b/backstop_data/engine_scripts/puppet/clickAndHoverHelper.js
@@ -1,9 +1,9 @@
module.exports = async (page, scenario) => {
- var hoverSelector = scenario.hoverSelectors || scenario.hoverSelector;
- var clickSelector = scenario.clickSelectors || scenario.clickSelector;
- var keyPressSelector = scenario.keyPressSelectors || scenario.keyPressSelector;
- var scrollToSelector = scenario.scrollToSelector;
- var postInteractionWait = scenario.postInteractionWait; // selector [str] | ms [int]
+ const hoverSelector = scenario.hoverSelectors || scenario.hoverSelector;
+ const clickSelector = scenario.clickSelectors || scenario.clickSelector;
+ const keyPressSelector = scenario.keyPressSelectors || scenario.keyPressSelector;
+ const scrollToSelector = scenario.scrollToSelector;
+ const postInteractionWait = scenario.postInteractionWait; // selector [str] | ms [int]
if (keyPressSelector) {
for (const keyPressSelectorItem of [].concat(keyPressSelector)) {
@@ -27,7 +27,9 @@ module.exports = async (page, scenario) => {
}
if (postInteractionWait) {
- await new Promise(resolve => setTimeout(resolve, postInteractionWait));
+ await new Promise(resolve => {
+ setTimeout(resolve, postInteractionWait);
+ });
}
if (scrollToSelector) {
diff --git a/backstop_data/engine_scripts/puppet/loadCookies.js b/backstop_data/engine_scripts/puppet/loadCookies.js
deleted file mode 100644
index db848a7cc7..0000000000
--- a/backstop_data/engine_scripts/puppet/loadCookies.js
+++ /dev/null
@@ -1,29 +0,0 @@
-var fs = require('fs');
-
-module.exports = async (page, scenario) => {
- var cookies = [];
- var cookiePath = scenario.cookiePath;
-
- // READ COOKIES FROM FILE IF EXISTS
- if (fs.existsSync(cookiePath)) {
- cookies = JSON.parse(fs.readFileSync(cookiePath));
- }
-
- // MUNGE COOKIE DOMAIN
- cookies = cookies.map(cookie => {
- cookie.url = 'https://' + cookie.domain;
- delete cookie.domain;
- return cookie;
- });
-
- // SET COOKIES
- const setCookies = async () => {
- return Promise.all(
- cookies.map(async (cookie) => {
- await page.setCookie(cookie);
- })
- );
- };
- await setCookies();
- console.log('Cookie state restored with:', JSON.stringify(cookies, null, 2));
-};
diff --git a/javascript.js b/javascript.js
new file mode 100644
index 0000000000..ced058317f
--- /dev/null
+++ b/javascript.js
@@ -0,0 +1,43 @@
+const products = [
+ {
+ imgSrc: 'images/imac.jpeg',
+ altText: 'Apple iMac',
+ title: 'APPLE A1419 iMac 27" Retina 5K Monoblock (MNED2UA/A)',
+ code: '195434',
+ reviews: 5,
+ price: '$2,199',
+ },
+ // Другие карточки
+];
+
+const productContainer = document.getElementById('product-container');
+
+products.forEach((product) => {
+ const card = document.createElement('div');
+ card.className = 'card';
+ card.setAttribute('data-qa', 'card');
+
+ card.innerHTML = `
+ 
+ ${product.title}
+ Product code: ${product.code}
+
+
+
+
+
+
+
+
+
Reviews: ${product.reviews}
+
+
Price:
+
${product.price}
+
Catalog
+
+
+
+
+
+
Product Name
+
Product code: 195434
+
+
+
+ Buy
+
+
+
+
+