@cake-hub/cake-screenshot_diffs/index.js

A CAKE Screenshot diffing tool that includes a setup to comapre two given resources by screenshots taken from the available pages.

const ParseYML = require ("./src/parse-yml");
const ParseJSON = require ("./src/parse-json");
const CommandLine = require ("./src/command-line");
const BackstopConfiguration = require ("./src/backstop-configuration");
const Crawler = require ("./src/crawler");
const path = require ("path");

// Wrapper to support await and async
module.exports = async (
    configurationFileName = path.resolve (__dirname, "./cake-screenshot.yml")
) => {
    // Prepare configuration
    const backstopConfigurationFileName = "./backstop.json";


    
    //#region PREPARE_CONFIGURATION

    // read custom config file
    const ymlFile = new ParseYML (configurationFileName);
    const userConfiguration = await ymlFile.parse ();

    // create backstop-configuration file
    let backstopConfiguration = new BackstopConfiguration ();

    // Add custom user configuration
    backstopConfiguration.updateKey ("reportPath", userConfiguration.reportPath);
    backstopConfiguration.updateKey ("viewports", userConfiguration.viewports);
    backstopConfiguration.update (userConfiguration.backstop);
    
    //#endregion PREPARE_CONFIGURATION
    


    //#region CRAWL_WEBSITES_AND_COLLECT_LINKS
    const crawlerConfiguration = {
        maxLinkFollowDepth: userConfiguration.crawlers.maxDepthToFollow || 3,
        maxConcurrentConnections: userConfiguration.crawlers.maxConcurrentConnections || 10,
        assetFileExtensions: userConfiguration.crawlers.assetFileExtensions || [
            ".png",
            ".jpg",
            ".jpeg",
            ".gif",
            ".mp4",
            ".svg",
        ],
        linkFileExtensionsToFollow: userConfiguration.crawlers.fileExtensions || [
            ".html",
        ],
    };

    const referenceCrawler = new Crawler (userConfiguration.referenceUrl, crawlerConfiguration);
    const crawler = new Crawler (userConfiguration.url, crawlerConfiguration);

    const referenceLinks = await referenceCrawler.getLinks ();
    const links = await crawler.getLinks ();

    //#endregion CRAWL_WEBSITES_AND_COLLECT_LINKS


    
    //#region BUILD_SCENARIOS

    let scenarios = [];
    let completeLinkList = [
        ...new Set ([
            ...links,
            ...referenceLinks,
        ]),
    ];

    for (const link of completeLinkList) {
        let scenario = {
            label: link.replace (/[^a-zA-Z0-9]/g, '_'),
            url: userConfiguration.url + link,
            referenceUrl: userConfiguration.referenceUrl + link,
        };
        scenarios.push ({
            ...scenario, 
            ...userConfiguration.scenarios,
        });
    }

    backstopConfiguration.updateKey ("scenarios", scenarios);

    //#endregion BUILD_SCENARIOS



    //#region STORE_BACKSTOP_CONFIGURATION

    // Store backstop.json configuration file
    const jsonFile = new ParseJSON (path.resolve (__dirname, backstopConfigurationFileName));
    await jsonFile.write (backstopConfiguration.getConfiguration ());

    //#endregion STORE_BACKSTOP_CONFIGURATION



    //#region CREATE_BACKSTOP_REPORT

    await CommandLine.execute ("npx backstop reference");
    await CommandLine.execute ("npx backstop test");

    //#endregion CREATE_BACKSTOP_REPORT

};