test: login modal

Author: danielo515

editions/online/tiddlywiki.info

@@ -1,16 +1,31 @@
 {
-    "plugins": [],
+    "plugins": [
+        "noteself/core"
+    ],
     "themes": [],
     "languages": [],
-    "includeWikis": [ {"path": "../base", "read-only": true} ],
+    "includeWikis": [
+        {
+            "path": "../base",
+            "read-only": true
+        }
+    ],
     "build": {
         "index": [
-            "--output", "./dist/online/",
-            "--rendertiddler", "$:/core/save/all", "index.html", "text/plain"
+            "--output",
+            "./dist/online/",
+            "--rendertiddler",
+            "$:/core/save/all",
+            "index.html",
+            "text/plain"
         ],
         "dev": [
-            "--output", "./dist/dev/",
-            "--rendertiddler", "$:/core/save/all", "index.html", "text/plain"
+            "--output",
+            "./dist/dev/",
+            "--rendertiddler",
+            "$:/core/save/all",
+            "index.html",
+            "text/plain"
         ]
     }
 }

jest.config.js

@@ -117,13 +117,7 @@ module.exports = {
     // setupFiles: [],
 
     // A list of paths to modules that run some code to configure or set up the testing framework before each test
-    setupFilesAfterEnv: [ '<rootDir>/test/jest-setup.js' ],
-
-    // A list of paths to snapshot serializer modules Jest should use for snapshot testing
-    // snapshotSerializers: [],
-
-    // The test environment that will be used for testing
-    // testEnvironment: "jest-environment-jsdom",
+    setupFilesAfterEnv: [ '<rootDir>/test/jest-setup.js', "expect-puppeteer" ],
 
     // Options that will be passed to the testEnvironment
     // testEnvironmentOptions: {},
@@ -174,6 +168,4 @@ module.exports = {
     // An array of regexp patterns that are matched against all source file paths before re-running tests in watch mode
     // watchPathIgnorePatterns: [],
 
-    // Whether to use watchman for file crawling
-    // watchman: true,
 };

test/__image_snapshots__/integration-test-js-visual-regression-test-of-online-version-custom-login-tab-1-snap.png

@@ -3,6 +3,8 @@
 const puppeteer = require('puppeteer');
 const path = require('path');
 
+const wait = time => new Promise(res => setTimeout(res, time))
+
 const waitForWikiLoad = async (page) => {
     await page.waitForSelector('#TP_splash_screen', { hidden: true });
     await page.waitForSelector('body.tc-body.tc-dirty', { hidden: true });
@@ -32,6 +34,23 @@ describe('Visual regression test of online version', () => {
         expect(image).toMatchImageSnapshot();
     });
 
+    it('login modal', async () => {
+        await page.click('[aria-label="login"]')
+        await page.waitForSelector('.tc-ns-login-popup', {visible: true})
+        await wait(1000)
+        const image = await page.screenshot({fullPage: true});
+        expect(image).toMatchImageSnapshot();
+    });
+
+    it('custom login tab', async () => {
+        await expect( page ).toClick('[aria-label="login"]')
+        await page.waitForSelector('.tc-ns-login-popup', {visible: true})
+        await wait(1000)
+        await expect(page).toClick('button',{text: 'Custom'})
+        const image = await page.screenshot({fullPage: true});
+        expect(image).toMatchImageSnapshot();
+    });
+
     afterAll(async () => {
         await browser.close();
     });

test/__image_snapshots__/integration-test-js-visual-regression-test-of-online-version-login-modal-1-snap.png

@@ -2555,6 +2555,11 @@ expand-tilde@^1.2.2:
   dependencies:
     os-homedir "^1.0.1"
 
+expect-puppeteer@^4.4.0:
+  version "4.4.0"
+  resolved "https://registry.yarnpkg.com/expect-puppeteer/-/expect-puppeteer-4.4.0.tgz#1c948af08acdd6c8cbdb7f90e617f44d86888886"
+  integrity sha512-6Ey4Xy2xvmuQu7z7YQtMsaMV0EHJRpVxIDOd5GRrm04/I3nkTKIutELfECsLp6le+b3SSa3cXhPiw6PgqzxYWA==
+
 expect@^26.0.1:
   version "26.0.1"
   resolved "https://registry.yarnpkg.com/expect/-/expect-26.0.1.tgz#18697b9611a7e2725e20ba3ceadda49bc9865421"