coco.e2e.js

const { Machine } = require('xstate');
const { createModel } = require('@xstate/test');

const cocoTestMachine = Machine({
  id: 'fetch',
  initial: 'home',
  context: {
    retries: 0
  },
  states: {
    home: {
      on: {
        WATCH_BTN_CLICK: 'selection'
      },
      meta: {
        test: async (page) => {
          await page.waitForTimeout('.watch-now-btn');
        }
      }
    },
    selection: {
      on: {
        SELECTION: 'comedian',
        GOTO_HOME: 'home'
      },
      meta: {
        test: async (page) => {
          await page.waitForTimeout('.comedian-selection-page');
        }
      }
    },
    comedian: {
      on: {
        GOTO_HOME: 'home'
      },
      meta: {
        test: async (page) => {
          await page.waitForTimeout('.comedian-videos');
        }
      }
    }
  }
});

const cocoTestModel = createModel(cocoTestMachine, {
  events: {
    WATCH_BTN_CLICK: {
      exec: async (page) => {
        await page.evaluate(() => {
          document.querySelector('button').click();
        });
      }
    },
    SELECTION: {
      exec: async (page) => {
        await page.waitForSelector('.album-arts');
        await page.evaluate(() => {
          document.querySelector('.album-art.selected').click();
        });
      }
    },
    GOTO_HOME: {
      exec: async (page) => {
        await page.waitForSelector('.header-menu');
        await page.evaluate(() => {
          document.querySelector('.header-menu--item.selected').click();
        });
      }
    }
  }
});

const cocoTestPlans = cocoTestModel.getSimplePathPlans();

cocoTestPlans.forEach((plan) => {
  describe(plan.description, () => {
    plan.paths.forEach((path) => {
      it(
        path.description,
        async () => {
          // await page.setUserAgent( 'UA-TEST' );
          // await page.setViewport({ width: 1980, height: 1024 });
          await page.goto('http://localhost:7575');
          await path.test(page);
        },
        10000
      );
    });
  });
});

it('coverage', () => {
  cocoTestModel.testCoverage();
});