@salesforcedevs/sfdocs-e2e 1.0.4-skip-footer → 1.0.5-alpha

package/README.md

@@ -43,6 +43,11 @@ Tests are organised into three suites, each targeting a different surface:
 - Google Chrome installed (ChromeDriver version is auto-detected from your local Chrome installation)
 - A running SFDocs portal at the target base URL
 
+The `static-portal` suite excludes the following tests that are not applicable to static builds:
+
+- `docs.api.test.ts` and `docs.test.ts` — landing pages that don't exist in static builds
+- Footer tests (`should display footer`) — footer component is not available in static builds
+
 ### Run against the static portal (default)
 
 ```bash
@@ -101,6 +106,7 @@ npx sfdocs-e2e --baseUrl http://localhost:8080
 # Choose a config suite
 npx sfdocs-e2e --config portal
 npx sfdocs-e2e --config static-portal
+npx sfdocs-e2e --config static-dsc-portal
 npx sfdocs-e2e --config search
 
 # Help
@@ -154,13 +160,18 @@ Publish a new version when:
 
 Always validate with an alpha release first, then promote to stable.
 
-**1. Publish an alpha (for testing)**
+The e2e package is marked `"private": true` so it is automatically skipped during the monorepo's standard `yarn release` workflow. Two convenience scripts handle temporarily removing the private flag, publishing, and restoring it:
+
+| Script              | Command                            | Description                        |
+| ------------------- | ---------------------------------- | ---------------------------------- |
+| `release:alpha:e2e` | `yarn release:alpha:e2e <version>` | Publish with the `alpha` dist-tag  |
+| `release:e2e`       | `yarn release:e2e <version>`       | Publish with the `latest` dist-tag |
 
-> The e2e package is marked `"private": true` so it is automatically skipped during the monorepo's standard `yarn release` workflow.
+**1. Publish an alpha (for testing)**
 
 ```bash
 cd packages/e2e
-yarn publish --tag alpha --new-version 1.0.0-alpha.0
+yarn release:alpha:e2e 1.0.0-alpha.0
 ```
 
 The `alpha` dist-tag means `yarn add @salesforcedevs/sfdocs-e2e` will **not** resolve this version by default — consumers must opt in explicitly:
@@ -179,19 +190,20 @@ Iterate on alphas as needed (`1.0.0-alpha.1`, `1.0.0-alpha.2`, ...) until the re
 
 ```bash
 cd packages/e2e
-yarn publish --tag latest --new-version 1.0.0
+yarn release:e2e 1.0.0
 ```
 
 **3. Future releases — bump and publish**
 
 ```bash
-# Bug fix
 cd packages/e2e
-yarn publish --tag latest --new-version 1.0.1
+
+# Bug fix
+yarn release:e2e 1.0.1
 
 # New feature
-yarn publish --tag latest --new-version 1.1.0
+yarn release:e2e 1.1.0
 
 # Breaking change
-yarn publish --tag latest --new-version 2.0.0
+yarn release:e2e 2.0.0
 ```

package/bin/publish.sh

@@ -0,0 +1,31 @@
+#!/usr/bin/env bash
+set -euo pipefail
+
+VERSION="${1:?Usage: publish.sh <version> [--tag <tag>]}"
+shift
+
+cp package.json .package.json.bak
+
+cleanup() {
+  mv .package.json.bak package.json
+  node -e "
+    var p = require('./package.json');
+    p.version = '$VERSION';
+    require('fs').writeFileSync('package.json', JSON.stringify(p, null, 2) + '\n');
+  "
+  git add package.json
+  git commit --amend --no-edit
+}
+trap cleanup EXIT
+
+node -e "
+  var p = require('./package.json');
+  delete p.private;
+  require('fs').writeFileSync('package.json', JSON.stringify(p, null, 2) + '\n');
+"
+
+if [ "$#" -gt 0 ]; then
+  yarn publish --new-version "$VERSION" "$@"
+else
+  yarn publish --new-version "$VERSION"
+fi

package/bin/run-e2e.js

@@ -56,6 +56,7 @@ Environment Variables:
 const configName = parsedArgs.config || 'static-portal';
 const configMap = {
     'static-portal': 'static-portal-wdio.conf.js',
+    'static-dsc-portal': 'static-dsc-portal-wdio.conf.js',
     portal: 'portal-wdio.conf.js',
     search: 'search-wdio.conf.js',
 };

package/common-wdio.conf.js

@@ -80,6 +80,7 @@ const defaultCapabilities = [
     },
 ];
 const defaultMochaTimeoutInterval = 200000; //increased timeout because its taking more time to load for references file
+const isGithubActions = Boolean(process.env.GITHUB_ACTIONS);
 
 // Resolve ChromeDriver version: env var → Chrome for Testing API lookup → latest
 const resolvedChromeDriverVersion = resolveChromedriverVersion();
@@ -181,15 +182,25 @@ exports.config = {
     // Services take over a specific job you don't want to take care of. They enhance
     // your test setup with almost no effort. Unlike plugins, they don't add new
     // commands. Instead, they hook themselves up into the test process.
-    services: [
-        [
-            'selenium-standalone',
-            {
-                installArgs: { drivers }, // drivers to install
-                args: { drivers }, // drivers to use
-            },
-        ],
-    ],
+    services: isGithubActions
+        ? []
+        : [
+              [
+                  'selenium-standalone',
+                  {
+                      installArgs: { drivers }, // drivers to install
+                      args: { drivers }, // drivers to use
+                  },
+              ],
+          ],
+    ...(isGithubActions
+        ? {
+              protocol: 'http',
+              hostname: '127.0.0.1',
+              port: 4444,
+              path: '/wd/hub',
+          }
+        : {}),
 
     // Framework you want to run your specs with.
     // The following are supported: Mocha, Jasmine, and Cucumber

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@salesforcedevs/sfdocs-e2e",
-  "version": "1.0.4-skip-footer",
+  "version": "1.0.5-alpha",
   "description": "E2E test suite for SFDocs static portal pages (SSG)",
   "license": "ISC",
   "bin": {
@@ -16,14 +16,13 @@
     "test:e2e": "TS_NODE_TRANSPILE_ONLY=true TS_NODE_PROJECT=./tsconfig.json wdio wdio.conf.js",
     "test:e2e:portal": "TS_NODE_TRANSPILE_ONLY=true TS_NODE_PROJECT=./tsconfig.json wdio portal-wdio.conf.js",
     "test:e2e:static:portal": "TS_NODE_TRANSPILE_ONLY=true TS_NODE_PROJECT=./tsconfig.json wdio static-portal-wdio.conf.js",
+    "test:e2e:static:dsc:portal": "TS_NODE_TRANSPILE_ONLY=true TS_NODE_PROJECT=./tsconfig.json wdio static-dsc-portal-wdio.conf.js",
     "test:scope-search": "TS_NODE_TRANSPILE_ONLY=true TS_NODE_PROJECT=./tsconfig.json wdio search-wdio.conf.js",
-    "prepublish:e2e": "node -e \"const p=require('./package.json'); delete p.private; require('fs').writeFileSync('./package.json', JSON.stringify(p, null, 2)+'\\n')\"",
-    "postpublish:e2e": "node -e \"const p=require('./package.json'); p.private=true; require('fs').writeFileSync('./package.json', JSON.stringify(p, null, 2)+'\\n')\"",
-    "release:alpha:e2e": "f() { yarn prepublish:e2e && yarn publish --tag alpha --new-version $1; yarn postpublish:e2e; }; f",
-    "release:e2e": "f() { yarn prepublish:e2e && yarn publish --new-version $1; yarn postpublish:e2e; }; f"
+    "release:alpha:e2e": "f() { bash bin/publish.sh $1 --tag alpha; }; f",
+    "release:e2e": "f() { bash bin/publish.sh $1; }; f"
   },
   "dependencies": {
-    "@sa11y/wdio": "^7.0.0",
+    "@sa11y/wdio": "^8.0.0",
     "@wdio/allure-reporter": "^7.19.0",
     "@wdio/cli": "^7.19.0",
     "@wdio/local-runner": "^7.19.0",

package/src/content-repo/specs/homepage.test.ts

@@ -13,7 +13,7 @@ describe('Homepage', () => {
     it('should show the expected number of projects', async () => {
         const projectCards = await HomePage.projectCards;
 
-        expect(projectCards.length).toEqual(17);
+        expect(projectCards.length).toEqual(20);
     });
 
     // it('is accessible', () => {

package/src/shared/pageobjects/page.ts

@@ -44,15 +44,15 @@ export default class Page {
         );
     }
 
-    async getHeader(): Promise<WebdriverIO.Element> {
-        return await $('hgf-c360contextnav');
+    async getHeader(headerTag = 'dx-global-header'): Promise<WebdriverIO.Element> {
+        return await $(headerTag);
     }
 
     async getHeaderTitle(): Promise<WebdriverIO.Element> {
         return (await $('>>>header')).$('h4');
     }
 
-    async getGlobalSearchBox(headerTag = 'dx-header'): Promise<WebdriverIO.Element> {
+    async getGlobalSearchBox(headerTag = 'dx-global-header'): Promise<WebdriverIO.Element> {
         return (await $(headerTag)).shadow$('dx-header-search');
     }
 

package/src/shared/specs/internalLinks.test.ts

@@ -0,0 +1,70 @@
+import GuidePage from '../pageobjects/guide.page';
+
+/**
+ * E2E tests for internal link resolution (internalReferencePlugin + referenceLinkTransformerPlugin).
+ * Covered: relative .md → .html resolution, guide-to-guide links, reference-to-guide links,
+ * external links.
+ **/
+describe('Internal link resolution', () => {
+    const UPDATE_ORDER_STATES_PAGE =
+        '/docs/commerce/test-cc-orders-api/guide/update-order-states.html';
+    const QUICK_START_PAGE = '/docs/commerce/test-cc-orders-api/guide/quick-start.html';
+    const REFERENCE_PAGE =
+        '/docs/success/sfdocs/references/markdown-cheatsheet/markdown-cheatsheet.html#how-to-link-between-overviews-guides-and-references';
+
+    let page: GuidePage;
+
+    it('should resolve relative guide link correctly', async () => {
+        page = new GuidePage(UPDATE_ORDER_STATES_PAGE);
+        page.open();
+        await page.waitPageLoad();
+
+        const ordersApiLink = await $('a.internal-link-guide[href*="orders-api-overview"]');
+        await ordersApiLink.waitForDisplayed();
+        const href = await ordersApiLink.getAttribute('href');
+        expect(href).not.toMatch(/\.md(?:\?|#|$)/);
+        expect(href).toContain('orders-api-overview.html');
+    });
+
+    it('should resolve guide linking in same folder correctly', async () => {
+        page = new GuidePage(QUICK_START_PAGE);
+        page.open();
+        await page.waitPageLoad();
+
+        await (await $('>>> doc-heading[hash="see-also"]')).waitForDisplayed();
+
+        const understandTheBasicsLink = await $('=Understand the Basics');
+        await understandTheBasicsLink.waitForDisplayed();
+        const href = await understandTheBasicsLink.getAttribute('href');
+        expect(href).not.toMatch(/\.md(?:\?|#|$)/);
+        expect(href).toContain('understand-the-basics.html');
+    });
+
+    it('should have html link for reference to guide linking', async () => {
+        page = new GuidePage(REFERENCE_PAGE);
+        page.open();
+        await page.waitPageLoad();
+
+        await (
+            await $('>>> doc-heading[hash="how-to-link-between-overviews-guides-and-references"]')
+        ).waitForDisplayed();
+
+        const threeContentTypesLink = await $('=three content types');
+        await threeContentTypesLink.waitForDisplayed();
+        const href = await threeContentTypesLink.getAttribute('href');
+        expect(href).toContain('guide');
+        expect(href).toMatch(/\.html(?:#|$|\?)/);
+    });
+
+    it('should treat external links as external', async () => {
+        page = new GuidePage(REFERENCE_PAGE);
+        page.open();
+        await page.waitPageLoad();
+
+        const externalLinks = await $$('a.external-link-guide');
+        expect(externalLinks.length).toBeGreaterThan(0);
+        for (const link of externalLinks) {
+            expect(await link.getAttribute('target')).toBe('_blank');
+        }
+    });
+});

package/src/shared/specs/layout-tests.ts

@@ -7,7 +7,7 @@ import Page from '../pageobjects/page';
  * @param givenPage : This is the current page for which we need to test chrome.
  */
 
-export default function layoutTest(givenPage: Page, headerTag = 'dx-header') {
+export default function layoutTest(givenPage: Page, headerTag = 'dx-global-header') {
     let page: Page;
     describe('Basic layout testing > ', () => {
         beforeEach(async () => {
@@ -15,10 +15,12 @@ export default function layoutTest(givenPage: Page, headerTag = 'dx-header') {
         });
 
         it('should display header', async () => {
-            const header = await $('hgf-c360contextnav');
+            const header = await $(headerTag);
             await header.waitForDisplayed();
             expect(await header.isDisplayed()).toBeTruthy();
-            expect(await header.getText()).toContain('Developers');
+            if (headerTag === 'dx-global-header') {
+                expect(await header.getText()).toContain('Developers');
+            }
         });
 
         it.skip('should display global search box', async () => {

package/src/shared/specs/liquid.test.ts

@@ -0,0 +1,94 @@
+import GuidePage from '../pageobjects/guide.page';
+
+let page: GuidePage;
+let liquidEnabled = false;
+
+describe('Liquid Template Rendering', () => {
+    before(async () => {
+        try {
+            page = new GuidePage('/docs/liquid-project/guide/liquid-quickstart.html');
+            page.open();
+            await page.waitPageLoad();
+
+            const content = await $('>>>doc-content-layout');
+            const html = await content.getHTML();
+            const text = await content.getText();
+
+            const hasLiquidOutput = text.includes('Hello from data.yaml');
+
+            const hasRawSyntax =
+                html.includes('{{ data.greeting }}') ||
+                html.includes('{{ topic }}') ||
+                (html.includes('{{') && html.includes('{%'));
+
+            if (hasRawSyntax) {
+                liquidEnabled = false;
+            } else if (hasLiquidOutput) {
+                liquidEnabled = true;
+            } else {
+                liquidEnabled = false;
+            }
+        } catch (e) {
+            liquidEnabled = false;
+        }
+    });
+
+    beforeEach(async () => {
+        if (liquidEnabled) {
+            page = new GuidePage('/docs/liquid-project/guide/liquid-quickstart.html');
+            page.open();
+            await page.waitPageLoad();
+        }
+    });
+
+    it('Should render Liquid variables from frontmatter and data.yaml', async function () {
+        if (!liquidEnabled) {
+            this.skip();
+        }
+
+        const content = await $('>>>doc-content-layout');
+        const text = await content.getText();
+
+        expect(text.includes('GitHub for writers')).toBeTruthy();
+        expect(text.includes('Hello from data.yaml')).toBeTruthy();
+
+        const html = await content.getHTML();
+        expect(html.includes('{{ topic }}')).toBeFalsy();
+        expect(html.includes('{{ data.greeting }}')).toBeFalsy();
+    });
+
+    it('Should render included templates from shared directory', async function () {
+        if (!liquidEnabled) {
+            this.skip();
+        }
+
+        const content = await $('>>>doc-content-layout');
+        const html = await content.getHTML();
+
+        expect(html.includes('AccountId') || html.includes('Type:')).toBeTruthy();
+        expect(html.includes('Properties:')).toBeTruthy();
+        expect(html.includes('Special Access Rules')).toBeTruthy();
+        expect(html.includes('{% include')).toBeFalsy();
+    });
+
+    it('Should render loops over data arrays', async function () {
+        if (!liquidEnabled) {
+            this.skip();
+        }
+
+        const content = await $('>>>doc-content-layout');
+        const html = await content.getHTML();
+        const text = await content.getText();
+
+        expect(text.includes('create()')).toBeTruthy();
+        expect(text.includes('query()')).toBeTruthy();
+        expect(text.includes('update()')).toBeTruthy();
+
+        const listItems = await content.$$('li');
+        expect(listItems.length).toBeGreaterThan(5);
+
+        expect(html.includes('{% for')).toBeFalsy();
+        expect(html.includes('{%- for')).toBeFalsy();
+        expect(html.includes('{% endfor')).toBeFalsy();
+    });
+});

package/src/shared/specs/reference.test.ts

@@ -9,6 +9,7 @@ describe('API Pages', () => {
         beforeEach(async () => {
             referencePage = new ReferencePage('/docs/commerce/test-cc-orders-api/references');
             referencePage.open();
+            await referencePage.waitForSpecBasedReferencePageLoad();
         });
 
         layoutTest(referencePage, 'doc-header');
@@ -85,6 +86,7 @@ describe('Reference Versioning', () => {
     beforeEach(async () => {
         referencePage = new ReferencePage('/docs/c-cart-apis/references/ref1?meta=Summary');
         referencePage.open();
+        await referencePage.waitForSpecBasedReferencePageLoad();
     });
 
     it('should check for the presence of version picker dropdown', async () => {
@@ -133,7 +135,7 @@ describe('Reference Versioning', () => {
 
         await versionOptions[1].waitForClickable();
         await versionOptions[1].click();
-        await browser.pause(1000);
+        await referencePage.waitForSpecBasedReferencePageLoad();
 
         const apiTitle = await (await $('>>>div.api-title span')).getText();
         const apiVersion = await (await $('>>>p.version span')).getText();
@@ -179,8 +181,10 @@ describe('Reference Versioning', () => {
 
         await referencePage.waitForSpecBasedReferencePageLoad();
         await referencePage.selectVersion();
+        await referencePage.waitForSpecBasedReferencePageLoad();
 
         const container = await $('>>>div.title-area div');
+        await container.waitForDisplayed();
         const apiTitle = await container.getText();
 
         expect(apiTitle).toEqual('createBasket');
@@ -274,6 +278,7 @@ describe('Spec-Based Flexible References', () => {
         await referencePage.waitForSpecBasedReferencePageLoad();
 
         const container = await $('>>>div.title-area div');
+        await container.waitForDisplayed();
         const apiTitle = await container.getText();
 
         expect(apiTitle).toEqual('getBasket');

package/static-dsc-portal-wdio.conf.js

@@ -0,0 +1,49 @@
+/**
+ * WebdriverIO configuration for E2E tests on Static Portal Pages (SSG) on DSC
+ *
+ * Prerequisites:
+ * 1. Build static pages: yarn build:static:portal
+ * 2. Start static server: yarn start:static:portal (runs on port 3000)
+ * 3. Run tests: yarn test:e2e:static:portal
+ */
+const BASE_CONFIG = require('./common-wdio.conf');
+
+exports.config = {
+    ...BASE_CONFIG.config,
+    // Static pages are served on port 3000 by default; override via E2E_BASE_URL env var
+    baseUrl: process.env.E2E_BASE_URL || 'http://localhost:3000',
+
+    // Reuse the same portal specs - static pages have the same URL structure
+    specs: ['./src/portal/specs/**/*.test.ts', './src/shared/specs/*.test.ts'],
+
+    // Exclude tests that require dynamic server features or pages not in static build
+    exclude: [
+        './src/portal/specs/docs.api.test.ts',
+        './src/portal/specs/docs.test.ts',
+        './src/shared/specs/banner.test.ts',
+    ],
+
+    // Output directory for static test results
+    outputDir: './_results_/static-portal',
+
+    // Override reporters to use separate output directories
+    reporters: [
+        'spec',
+        [
+            require('wdio-video-reporter'),
+            {
+                saveAllVideos: false,
+                videoSlowdownMultiplier: 3,
+                outputDir: './_results_/static-portal/videos',
+            },
+        ],
+        [
+            'allure',
+            {
+                outputDir: './_results_/static-portal/allure-raw',
+                disableWebdriverStepsReporting: true,
+                disableWebdriverScreenshotsReporting: false,
+            },
+        ],
+    ],
+};

package/static-portal-wdio.conf.js

@@ -24,13 +24,6 @@ exports.config = {
         './src/portal/specs/docs.test.ts',
     ],
 
-    // Skip footer tests - footer is not available in static builds
-    mochaOpts: {
-        ...BASE_CONFIG.config.mochaOpts,
-        grep: 'should display footer',
-        invert: true,
-    },
-
     // Output directory for static test results
     outputDir: './_results_/static-portal',