chore(ci): Shortcode tests using example.md. Support test-only files (such as example.md) without abusing draft mode.

- Add a frontmatter test-only attribute for files like example.md. Don't use draft: true for these files.
- Add support in index.html for the attribute so that the files are only rendered when running in the testing environment.
- e2e smoke test using example.md, ensure it renders without JavaScript errors.

Author: jstirnaman

content/example.md

@@ -6,7 +6,7 @@ related:
   - /influxdb/v2/write-data/
   - /influxdb/v2/write-data/quick-start
   - https://influxdata.com, This is an external link
-draft: true
+test_only: true  # Custom parameter to indicate test-only content
 ---
 
 This is a paragraph. Lorem ipsum dolor ({{< icon "trash" "v2" >}}) sit amet, consectetur adipiscing elit. Nunc rutrum, metus id scelerisque euismod, erat ante suscipit nibh, ac congue enim risus id est. Etiam tristique nisi et tristique auctor. Morbi eu bibendum erat. Sed ullamcorper, dui id lobortis efficitur, mauris odio pharetra neque, vel tempor odio dolor blandit justo.

cypress/e2e/content/example-page.cy.js

@@ -0,0 +1,45 @@
+/// <reference types="cypress" />
+
+describe('Example page shortcodes and JavaScript', function() {
+  before(function() {
+    // Track JavaScript errors
+    cy.on('uncaught:exception', (err, runnable) => {
+      // Log the error to the Cypress command log
+      cy.log(`JavaScript error: ${err.message}`);
+      
+      // Add the error to the test failure message
+      Cypress.failures = Cypress.failures || [];
+      Cypress.failures.push(err.message);
+      
+      // Return false to prevent Cypress from failing the test
+      // We want to continue the test and record all errors
+      return false;
+    });
+  });
+  
+  beforeEach(function() {
+    // Clear any stored failures before each test
+    Cypress.failures = [];
+    
+    // Visit the example page
+    cy.visit('/example/');
+  });
+  
+  it('loads without JavaScript errors', function() {
+    // Check if page loaded successfully
+    cy.title().should('not.be.empty');
+    
+    // Verify no JavaScript errors were recorded
+    cy.wrap(Cypress.failures).should('be.empty', 
+      'The following JavaScript errors were detected:\n' + 
+      (Cypress.failures || []).join('\n'));
+  });
+  
+  it('has expected content structure', function() {
+    // Basic page structure checks
+    cy.get('h1').should('exist');
+    cy.get('main').should('exist');
+  });
+  
+  // Add more specific tests for the example page content as needed
+});

layouts/index.html

@@ -6,6 +6,13 @@
 {{ $kapacitorVersion := replaceRE "v" "" .Site.Data.products.kapacitor.latest }}
 {{ $fluxVersion := replaceRE "v" "" .Site.Data.products.flux.latest }}
 
+<!--
+  Show the page if:
+  - This is a regular page (not test-only) OR
+  - This is a test-only page BUT we're currently in the testing environment
+-->
+{{ if or (not .Params.test_only) (and .Params.test_only (eq site.Params.environment "testing")) }}
+
 {{ partial "header.html" . }}
 {{ partial "topnav.html" . }}
 
@@ -264,3 +271,9 @@ <h4>Enterprise</h4>
   </div>
 </div>
 {{ partial "footer.html" . }}
+{{ else }}
+  <!-- Return 404 or empty template for test_only content in production -->
+  {{ if eq .Params.test_only true }}
+    {{ template "404.html" . }}
+  {{ end }}
+{{ end }}