add 404 checking for graybox dc (#455)

* add tests for graybox-bacom

* just use chrome

* add more waiting time

* add merch card

* add 404 checker for graxybox-bacom

* update gitignore and file name

* add screenshots for graybox-dc

* add 404 checking for graybox dc

configs/graybox-dc.config.js

@@ -0,0 +1,80 @@
+// @ts-check
+const { devices } = require('@playwright/test');
+
+const envs = require('../envs/envs.js');
+
+/**
+ * @see https://playwright.dev/docs/test-configuration
+ * @type {import('@playwright/test').PlaywrightTestConfig}
+ */
+const config = {
+  testDir: '../tests/',
+  testMatch: ['dc/**/*.test.js', 'milo/**/*.test.js', 'graybox/**/*.test.js'],
+  outputDir: '../test-results',
+  /* Maximum time one test can run for. */
+  timeout: 45 * 1000,
+  expect: {
+    /**
+     * Maximum time expect() should wait for the condition to be met.
+     * For example in `await expect(locator).toHaveText();`
+     */
+    timeout: 10 * 1000,
+  },
+  /* Run tests in files in parallel */
+  fullyParallel: true,
+  /* Fail the build on CI if you accidentally left test.only in the source code. */
+  forbidOnly: !!process.env.CI,
+  /* Retry on CI only */
+  retries: process.env.CI ? 2 : 0,
+  /* Opt out of parallel tests on CI. */
+  workers: process.env.CI ? 2 : undefined,
+  /* Reporter to use. See https://playwright.dev/docs/test-reporters */
+  reporter: process.env.CI
+    ? [['github'], ['list'], ['../utils/reporters/base-reporter.js'], ['json', { outputFile: '../test-json-results/test-results.json' }]]
+    : [
+      [
+        'html',
+        {
+          outputFolder: 'test-html-results',
+          open: 'never',
+        },
+      ],
+      ['list'],
+      ['../utils/reporters/base-reporter.js'],
+      ['json', { outputFile: '../test-json-results/test-results.json' }],
+    ],
+
+  /* Shared settings for all the projects below. See https://playwright.dev/docs/api/class-testoptions. */
+  use: {
+    /* Maximum time each action such as `click()` can take. Defaults to 0 (no limit). */
+    actionTimeout: 60000,
+    /* Base URL to use in actions like `await page.goto('/')`. */
+    // baseURL: 'http://localhost:3000',
+
+    /* Collect trace when retrying the failed test. See https://playwright.dev/docs/trace-viewer */
+    trace: 'on-first-retry',
+    baseURL:
+      process.env.BASE_URL
+      || envs['@graybox_dc']
+      || 'https://main--dc--adobecom.hlx.live',
+  },
+
+  /* Configure projects for major browsers */
+  projects: [
+    {
+      name: 'dc-live-chrome',
+      use: {
+        ...devices['Desktop Chrome'],
+        baseURL: envs['@graybox_dc'],
+      },
+    },
+    {
+      name: 'dc-stage-chrome',
+      use: {
+        ...devices['Desktop Chrome'],
+        baseURL: envs['@adobe_stage'],
+      },
+    },
+  ],
+};
+module.exports = config;

features/graybox/sot.dc.404.spec.js

@@ -0,0 +1,13 @@
+module.exports = {
+  name: 'Graybox DC SOT 404 Check',
+  features: [
+    {
+      tcid: '0',
+      name: '@graybox-dc-404-check',
+      stable: '@adobe_stage',
+      beta: '@graybox_dc',
+      tags: '@graybox-dc-404-check',
+      data: 'data/graybox/sot-dc.yml',
+    },
+  ],
+};

tests/graybox/sot.dc.404.test.js

@@ -0,0 +1,68 @@
+/* eslint-disable no-restricted-syntax */
+/* eslint-disable import/named */
+import { test } from '@playwright/test';
+import { features } from '../../features/graybox/sot.dc.404.spec.js';
+
+const fs = require('fs'); // Add this import at the top
+
+const { WebUtil } = require('../../libs/webutil.js');
+
+const results = {};
+let consoleErrors = [];
+let four0FourErrors = [];
+
+test.describe('Graybox DC SOT 404 Check test suite', () => {
+  test.setTimeout(20 * 60 * 1000);
+  test.beforeEach(async ({ page }) => {
+    // Check for 404s
+    page.on('response', (response) => {
+      if (response.status() === 404) {
+        console.log(`Resource not found: ${response.url()}`);
+        four0FourErrors.push(`Resource not found: ${response.url()}`);
+      }
+    });
+
+    // Check for console errors
+    page.on('console', (msg) => {
+      if (msg.type() === 'error') {
+        console.error(`Console error: ${msg.text()}`);
+        consoleErrors.push(`Console error: ${msg.text()}`); // Fix to store console errors in the results object
+      }
+    });
+  });
+
+  for (const feature of features) {
+    // eslint-disable-next-line no-loop-func
+    test(`${feature.name},${feature.tags}`, async ({ page }) => {
+      // load test data from static files
+      const testdata = await WebUtil.loadTestData(`${feature.data}`);
+
+      for (const key of Object.keys(testdata)) {
+        consoleErrors = [];
+        four0FourErrors = [];
+        const stableURL = testdata[key];
+        const betaURL = stableURL.replace('www.stage', 'test.graybox');
+        console.info('Checking for 404s on:', betaURL);
+        // Go to the page you want to check
+        await page.goto(betaURL);
+
+        // Wait for some time to ensure all resources are loaded
+        await page.waitForLoadState('networkidle'); // Better way to wait for page load
+        // {{ edit_1 }}: Log all links on the page
+        const links = await page.$$eval('a', (anchors) => anchors.map((anchor) => anchor.href));
+        console.log('Links on the page:', links);
+        results[betaURL] = {
+          four0FourErrors,
+          consoleErrors,
+          links,
+        };
+      }
+    });
+  }
+
+  // {{ edit_3 }}: Write results to JSON file after all tests
+  test.afterAll(async () => {
+    fs.writeFileSync('graybox-dc-404-results.json', JSON.stringify(results, null, 2));
+    console.log('Results saved to graybox-dc-404-results.json');
+  });
+});