Как настроить отчет о тестировании, используя пакет mocha-awesome на коде? - PullRequest
0 голосов
/ 02 мая 2019

В настоящее время я пытаюсь настроить тесты пользовательского интерфейса в javascript.Я использую несколько инструментов, таких как мокко и кукловод.Мой тест - сравнение изображений между двумя версиями продукта.Итак, у меня есть скрипт screenshot.js, который делает мне скриншот на каждой странице, и другой скрипт compare.js, который сравнивает меня с изображениями двух версий, и если есть разница, то создается изображение, показывающее разницу двух изображений, которыебыли сравнены.

Чтобы иметь возможность выполнить тестовый отчет с различиями между изображениями.Я нашел отличный инструмент, который делает отчеты об испытаниях, но я думаю, что настроил его неправильно.

compare.js

let fs = require("fs"),
  PNG = require("pngjs").PNG,
  pixelmatch = require("pixelmatch");
let assert = require("chai").assert;
let expect = require("chai").expect;

const rimraf = require("rimraf");
const path = require("path");
const mkdirp = require("mkdirp");

const config = require("./config.json").compare;
const versions = require("./config.json").version;

let imgFolder = path.join(__dirname, config.image);

const folderCurrent = path.join(imgFolder, versions.current);
const folderOld = path.join(imgFolder, versions.old);
const diffFolder = path.join(imgFolder, config.diff);

const dirFolder = path.join(diffFolder, "*");
mkdirp(diffFolder);
rimraf.sync(dirFolder);

describe("Compare images", function() {
  let files = fs.readdirSync(folderCurrent);

  files.forEach(value => {
    it(`Image: ${value}`, async () => {
      return compareScreenshots(value);
    });
  });
});

function compareScreenshots(file) {
  return new Promise((resolve, reject) => {
    const img1 = fs
      .createReadStream(path.join(folderCurrent, file))
      .pipe(new PNG())
      .on("parsed", doneReading);
    const img2 = fs
      .createReadStream(path.join(folderOld, file))
      .pipe(new PNG())
      .on("parsed", doneReading);

    let filesRead = 0;

    function doneReading() {
      if (++filesRead < 2) return;

      // The files should be the same size.
      expect(img1.width, "image widths are the same").equal(img2.width);
      expect(img1.height, "image heights are the same").equal(img2.height);

      const diff = new PNG({ width: img1.width, height: img1.height });
      const mismatch = pixelmatch(
        img1.data,
        img2.data,
        diff.data,
        img1.width,
        img1.height,
        {
          threshold: 0.05
        }
      );

      if (mismatch !== 0) {
        diff
          .pack()
          .pipe(
            fs.createWriteStream(
              path.join(diffFolder, "diff-" + path.basename(file))
            )
          );
      }

      // The files should look the same.
      expect(mismatch, "number of different pixels").equal(0);
      resolve();
    }
  });
}

server.js

const express = require('express');
const app = express();
const path = require('path');
const port = 9988;
app.use(express.static(__dirname +'/mochawesome-report'));
app.get('/', (req, res) => {
   res.sendFile(path.join(__dirname+"/mochawesome-report"+"/mochawesome.html"));
});
app.listen(port, () => console.log(`Test Report shows on port ${port}`));

Я прошу у вас совета о том, как адаптировать мой код или конфигурацию, чтобы сначала создать тестовый отчет,Вы думаете, это возможно?

...