W3C Unit Test Example

W3CUnitTestExample.jsx

import fs from 'fs';
import React from 'react';
import 'jest-styled-components';
// https://gist.github.com/helabenkhalfallah/6616ad01d544e1c1ed64f879c6e5e485
import JestHelper from './JestHelper';

const {
  getHtmlPageWrapper,
  getHtmlW3CComplianceMessage,
  isHtmlW3CCompliant,
} = JestHelper;

// W3C compliance is based on :
// npm : https://www.npmjs.com/package/vnu-jar
// github: https://github.com/validator/validator
// NU: check are same as https://validator.w3.org/nu/
expect.extend({
  toBeW3CCompliant(received, validator) {
    if (validator(received)) {
      return {
        message: () => getHtmlW3CComplianceMessage({
          html: received?.html,
          error: null,
        }),
        pass: true,
      };
    }
    return {
      message: () => getHtmlW3CComplianceMessage({
        html: received?.html,
        error: received.error,
      }),
      pass: false,
    };
  },
});

describe('TestExample (W3C)', () => {
  const w3cHtmlFilPath = './TestExample-W3C.html';
  let w3cValidation = {};

  beforeAll(() => {
    // React component to html
    const htmlComponent = (
       <section>
         My React JS code
       </section>
    );

    // wrap html component to have a valid page
    w3cValidation.html = getHtmlPageWrapper(htmlComponent);
  });

  afterAll(() => {
    // reset validation status
    w3cValidation = {};

    // remove test temps file
    if (fs.existsSync(w3cHtmlFilPath)) {
      fs.unlinkSync(w3cHtmlFilPath);
    }
  });

  it('TestExample - Vérification de la compliance W3C (NU)', async () => {
    try {
      // eslint-disable-next-line global-require
      const vnu = require('vnu-jar');
      fs.writeFileSync(w3cHtmlFilPath, w3cValidation.html);

      // eslint-disable-next-line global-require
      const util = require('util');
      // eslint-disable-next-line global-require
      const exec = util.promisify(require('child_process').exec);
      await exec(`java -jar ${vnu} ${w3cHtmlFilPath}`);

      // update validation status
      w3cValidation.error = null;
    } catch (exception) {
      // update validation status
      w3cValidation.error = exception.message;
    }

    expect(w3cValidation).toBeW3CCompliant(isHtmlW3CCompliant);
  });
});