chore: add feature e2e tests and improve overall testing (#289)

* chore: feature test i18n * refactor: added close function to server * refactor: use isProd instead of process env * chore: added jest env to js files * chore: updated jest config and added setup script * fix: use distPath instead of distDir * chore: added first feature test for i18n * chore: added jest puppeteer config * chore: added NODE_ENV env variable * chore: updated circleci config * chore: added puppeteer orb * chore: update circleci config * chore: updated jest puppeteer config * chore: disable headless * updated ci config * updated ci config * fix: fixed circleci config * chore: updated circleci config * chore: updated circleci config * chore: added puppeteer install to install job * chore: first checkout * fix: remove orb and added run command to install * fix: moved install deps to test job * chore: added build to test * chore: use package.json for checksum * chore: removed build job * added install * chore: removed install * check node_env * chore: set NODE_ENV to test * refactor: remove distDir * refactor: move aver config * log distPath * moved NODE_ENV * updated ci config * log dirname * fix: fixed cli tests * fix: added typing to args * fix: fixed typings and removed test files from exclude * chore: include __tests__ dir * chore: added check for i18n mixin * refactor: added testFeature function * test: added feature test for vue-progressbar * chore: pass all logs to consola and pause logging * fix: fixed thickness in vue-progressbar test * refactor: added options for testFeature * refactor: added feature test for dev build * refactor: added close functions to builder and renderer and core * refactor: added 404 check * linting * linting * linting * linting * fix: added build scripts * test: added build scripts tests * fix: fixed config file * fix: fixed config * fix: fixed types * refactor: added watchers array * refactor: do not open browser in feature tests * chore: remove unused deps * fix: disable thread loder for circle ci tests * fix: fixed typings for api extractor * ci: updated circleci config * ci: added missing job * ci: updated build job * test: reset puppeteer browser after all * ci: fixed config * fix: always run dev test first * ci: do not depend on build job * test: istanbul ignore open browser file * refactor: use optional chaining * test: added tests for mailer plugin * fix: fixed typings * test: added tests for mongodb plugin * test: fixed mongodb test * fix: do not run mailer plugin on build * test: added test for websocket plugin * test: added csrf tests * chore: allow missing page config * chore: updated types for createRenderer * test: added test for create renderer * test: clear cookies after tests * test: added helmet tests * test: removed test sequencer * test: added back sequencer * chore: enabled logging and updated watcher * chore: ignore storage folders * chore: remove console.log * test: remove storage folder after test * test: added tests for typescript plugin * chore: log error log * chore: endabled console log * test: clear log before all * ci: use circlei test reporter * ci: fixed junit install * ci: fix test steps * test: added tests for typescript runtime package * fix: promisify server close for proper tear down * chore: removed test sequencer * chore: added close and updated types * test: updated dev e2e test * chore: added keepDist and keepLogs and do not clear logs in beforeAll * fix: fixed dst path for entries when in subfolder * fix: clear hooks after build * test: added tests for plugins * test: disabled show console logs * chore: removed console log * feat: added before and after close hooks * test: check mocked calles in after close hook * test: added tests for session plugin * fix: split by entries folder not just the word * chore: removed default config * chore: use distDir * fix: changed import for dev and hot middlewares * test: added tests for plugin entries hmr * chore: disable show logs * ci: do not updated lockfile * test: fix dev test * test: added test for static builds * chore: disable show console logs * test: added tests for service worker * test: added test for webpack config hooks * fix: clear stuff after close * test: added istanbul ignore for requireModule * test: added istanbul ignore for requireModule * test: added test for transpile deps * chore: removed options * fix: fixed service worker tests * chore: disable options * fix: fixed plugins entries hmr test * fix: use read file instead of require * chore: added test for error * test: added css extract test * fix: do not start server in static mode * chore: await run commands * fix: do not cache when css extract is active * test: added test for css and postcss * test: added dotenv test * test: added tests for www class * test: moved test www to server and added robots.txt test * test: added test for webpack aliases * test: added test for open browser * chore: do not log message in test * test: changed back path * test: changed dotenv test * fix: fixed typings for webpack alias * fix: exit process on build error * test: added test for files changed plugin * test: remove env test check * test: added test for additional extensions * test: added test for asyncData hook * test: check for store file to include extensions * linting * test: check for asyncData class hook * chore: remove show console logs * ci: increase memory limit * ci: added junit dep as resporter * refactor: added internal aver config type and the normal config type which is partial now * fix: fixed persisted state on server side * test: added test for vuex * fix: added next for error middleware to work * test: added tests for favicon, middleware entry file and error handling * chore: removed options * test: renamed to babel loader and updated tests * test: added test for clear server cache * refactor: added types for babel confg param * test: added test for build errors * test: added vue-meta tests * test: added test for copy webpack plugin * test: check error when service-worker.js is missing * chore: updated types and chaining * test: hooks should not fail on false config
exreplay · Jan 5, 2021 · 03da98c · 03da98c
1 parent 5b78692
commit 03da98c
Show file tree

Hide file tree

Showing 221 changed files with 5,537 additions and 638 deletions.
diff --git a/.circleci/config.yml b/.circleci/config.yml
@@ -1,43 +1,84 @@
-# Javascript Node CircleCI 2.0 configuration file
-#
-# Check https://circleci.com/docs/2.0/language-javascript/ for more details
-#
-version: 2
-jobs:
-  build:
-    docker:
-      # specify the version you desire here
-      - image: circleci/node:latest
+version: 2.1
 
-      # Specify service dependencies here if necessary
-      # CircleCI maintains a library of pre-built images
-      # documented at https://circleci.com/docs/2.0/circleci-images/
-      # - image: circleci/mongo:3.4.4
-
-    working_directory: ~/repo
+defaults: &defaults
+  working_directory: ~/repo
+  docker:
+    - image: circleci/node:latest
 
+jobs:
+  install:
+    <<: *defaults
     steps:
       - checkout
-
-      # Download and cache dependencies
       - restore_cache:
           keys:
-            - v1-dependencies-{{ checksum "package.json" }}
-            # fallback to using the latest cache if no exact match is found
-            - v1-dependencies-
-
-      - run: yarn install
-
+            - v1-averjs-{{ checksum "package.json" }}
+      - run: yarn install --frozen-lockfile
       - save_cache:
           paths:
             - node_modules
-          key: v1-dependencies-{{ checksum "package.json" }}
-
-      - run: yarn lint
-
+          key: v1-averjs-{{ checksum "package.json" }}
+      - persist_to_workspace:
+          root: ~/
+          paths:
+            - repo
+
+  build:
+    <<: *defaults
+    steps:
+      - attach_workspace:
+          at: ~/
       - run: yarn build-scripts
-
       - run: yarn build
+
+  lint: 
+    <<: *defaults
+    steps:
+      - attach_workspace:
+          at: ~/
+      - run: yarn lint
+
+  test: 
+    <<: *defaults
+    steps:
+      - attach_workspace:
+          at: ~/
+      - run:
+          name: Install Headless Chrome dependencies
+          command: |
+            sudo apt-get install -yq \
+            gconf-service libasound2 libatk1.0-0 libatk-bridge2.0-0 libc6 libcairo2 libcups2 libdbus-1-3 \
+            libexpat1 libfontconfig1 libgcc1 libgconf-2-4 libgdk-pixbuf2.0-0 libglib2.0-0 libgtk-3-0 libnspr4 \
+            libpango-1.0-0 libpangocairo-1.0-0 libstdc++6 libx11-6 libx11-xcb1 libxcb1 libxcomposite1 libxcursor1 \
+            libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1 libxss1 libxtst6 ca-certificates \
+            fonts-liberation libappindicator1 libnss3 lsb-release xdg-utils wget
+      - run:
+          name: Run tests with JUnit as reporter
+          command: yarn jest --ci --runInBand --reporters=default --reporters=jest-junit
+          environment:
+            JEST_JUNIT_OUTPUT_DIR: ./reports/junit/
+            NODE_OPTIONS: --max_old_space_size=4096
+            NODE_ENV: test
+            CIRCLE_CI: true
+      - run:
+          name: Run code coverage
+          command: yarn codecov
+      - store_test_results:
+          path: ./reports/junit/
+      - store_artifacts:
+          path: ./reports/junit
 
-      # run tests!
-      - run: yarn test
+workflows:
+  version: 2.1
+  test:
+    jobs:
+      - install
+      - build:
+          requires:
+            - install
+      - lint:
+          requires:
+            - install
+      - test:
+          requires:
+            - install
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -6,6 +6,9 @@ module.exports = {
   env: {
     jest: true
   },
+  globals: {
+    jestPuppeteer: true
+  },
   extends: [
     'standard',
     'eslint:recommended',
@@ -85,18 +88,23 @@ module.exports = {
     },
     {
       files: ['**/*.js', '**/*.vue'],
-      extends: ['@averjs', 'plugin:prettier/recommended'],
+      env: {
+        jest: true
+      },
+      extends: ['@averjs'],
       rules: {
-        'space-before-function-paren': 'off'
+        indent: 'off',
+        'space-before-function-paren': 'off',
+        'vue/script-indent': 'off'
       }
+    },
+    {
+      files: ['packages/@averjs/vue-app/templates/**/*.js'],
+      parserOptions: {
+        parser: 'babel-eslint',
+        ecmaVersion: 2015
+      },
+      extends: ['plugin:lodash-template/recommended-with-script']
     }
-    // {
-    //   files: ['packages/@averjs/vue-app/templates/**/*.js'],
-    //   parserOptions: {
-    //     parser: 'babel-eslint',
-    //     ecmaVersion: 2015
-    //   },
-    //   extends: ['plugin:lodash-template/recommended-with-script']
-    // }
   ]
 };
diff --git a/.gitignore b/.gitignore
@@ -11,4 +11,5 @@ verdaccio
 packages/test
 .changelog
 temp
-scripts-build
+scripts-build
+__tests__/**/storage
diff --git a/__tests__/features/additional-extensions.spec.ts b/__tests__/features/additional-extensions.spec.ts
@@ -0,0 +1,43 @@
+import { testFeature } from '../utils/feature';
+import fs from 'fs';
+import path from 'path';
+
+testFeature('additional-extensions', currentDir => {
+  test('should add the additional extensions to entries regex', async () => {
+    const response = await page.goto('http://localhost:3000');
+    const content = await page.content();
+    expect(await response?.text()).toContain(
+      '<span>server entry works</span><span>i18n entry works</span><span>app entry works</span>'
+    );
+    expect(content).toContain(
+      '<span>client entry works</span><span>i18n entry works</span><span>app entry works</span>'
+    );
+
+    const appContent = fs.readFileSync(
+      path.resolve(currentDir, './node_modules/.cache/averjs/app.js'),
+      'utf-8'
+    );
+    const clientContent = fs.readFileSync(
+      path.resolve(currentDir, './node_modules/.cache/averjs/entry-client.js'),
+      'utf-8'
+    );
+    const entryServerContent = fs.readFileSync(
+      path.resolve(currentDir, './node_modules/.cache/averjs/entry-server.js'),
+      'utf-8'
+    );
+    const i18nContent = fs.readFileSync(
+      path.resolve(currentDir, './node_modules/.cache/averjs/i18n.js'),
+      'utf-8'
+    );
+    const storeContent = fs.readFileSync(
+      path.resolve(currentDir, './node_modules/.cache/averjs/store/index.js'),
+      'utf-8'
+    );
+
+    expect(appContent).toContain('(js|ts)');
+    expect(clientContent).toContain('(js|ts)');
+    expect(entryServerContent).toContain('(js|ts)');
+    expect(i18nContent).toContain('(js|ts)');
+    expect(storeContent).toContain('(js|ts)');
+  });
+});
diff --git a/__tests__/features/alias.spec.ts b/__tests__/features/alias.spec.ts
@@ -0,0 +1,10 @@
+import { testFeature } from '../utils/feature';
+
+testFeature('alias', () => {
+  test('should resolve webpack aliases correctly', async () => {
+    await page.goto('http://localhost:3000');
+    expect(await page.content()).toContain(
+      '<div id="app"><div><span>vuex</span><span>src</span><span>root</span><span>components</span><span>mixins</span><span>resources</span><span>[{"path":"/","name":"home"}]</span><span>test</span></div></div>'
+    );
+  });
+});
diff --git a/__tests__/features/async-data.spec.ts b/__tests__/features/async-data.spec.ts
@@ -0,0 +1,27 @@
+import { testFeature } from '../utils/feature';
+
+testFeature('async-data', () => {
+  test('should fetch data before rendering component on page change', async () => {
+    await page.goto('http://localhost:3000');
+    await (await page.$('a'))?.click();
+    const watchDog = page.waitForFunction('window.status === "ready"');
+    await watchDog;
+    expect(await page.content()).toContain(
+      '<div id="app"><div>some async data</div></div>'
+    );
+  });
+
+  test('should fetch data before ssr', async () => {
+    const response = await page.goto('http://localhost:3000/test');
+    expect(await response?.text()).toContain(
+      '<div id="app" data-server-rendered="true"><div>some async data</div></div>'
+    );
+  });
+
+  test('should have the asyncData class hook registered', async () => {
+    const response = await page.goto('http://localhost:3000/test-class');
+    expect(await response?.text()).toContain(
+      '<div id="app" data-server-rendered="true"><div>some async data</div></div>'
+    );
+  });
+});
diff --git a/__tests__/features/babel-loader.spec.ts b/__tests__/features/babel-loader.spec.ts
@@ -0,0 +1,109 @@
+import { rebuild, testFeature } from '../utils/feature';
+import fs from 'fs-extra';
+import path from 'path';
+
+testFeature(
+  'babel-loader',
+  () => {
+    test('should transpile given deps correctly', async () => {
+      await page.goto('http://localhost:3000');
+      const content = await page.content();
+
+      expect(content).toContain(
+        '<div id="app"><span>test</span><span>another test</span><div>should be compiled</div></div>'
+      );
+    });
+
+    test('should transpile deps with regex correctly', async () => {
+      await rebuild({
+        webpack: {
+          transpileDependencies: [/package-to-transpile/]
+        }
+      });
+
+      await page.goto('http://localhost:3000');
+      const content = await page.content();
+
+      expect(content).toContain(
+        '<div id="app"><span>test</span><span>another test</span><div>should be compiled</div></div>'
+      );
+    });
+
+    test('should ignore non string and non regex', async () => {
+      await rebuild({
+        webpack: {
+          transpileDependencies: [
+            /package-to-transpile/,
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
+            // eslint-disable-next-line @typescript-eslint/no-empty-function
+            () => {}
+          ]
+        }
+      });
+
+      await page.goto('http://localhost:3000');
+      const content = await page.content();
+
+      expect(content).toContain(
+        '<div id="app"><span>test</span><span>another test</span><div>should be compiled</div></div>'
+      );
+    });
+
+    test('should throw error when the package is missing in the transpileDependencies array', async () => {
+      try {
+        await rebuild({
+          webpack: {
+            transpileDependencies: []
+          }
+        });
+      } catch (error) {
+        expect(error).toContain("SyntaxError: Unexpected token 'export'");
+      }
+    });
+
+    test('should fallback to empty array', async () => {
+      try {
+        await rebuild({
+          webpack: {
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
+            transpileDependencies: null
+          }
+        });
+      } catch (error) {
+        expect(error).toContain("SyntaxError: Unexpected token 'export'");
+      }
+    });
+
+    test('should call the babel function correctly', async () => {
+      const babel = jest.fn();
+      await rebuild({
+        webpack: {
+          babel
+        }
+      });
+      expect(babel.mock.calls.length).toBe(2);
+      expect(babel.mock.calls[0]).toEqual(
+        expect.arrayContaining([{ isServer: false }, { buildTarget: 'client' }])
+      );
+      expect(babel.mock.calls[1]).toEqual(
+        expect.arrayContaining([{ isServer: true }, { buildTarget: 'server' }])
+      );
+    });
+  },
+  {},
+  currentDir => {
+    beforeAll(() => {
+      fs.copySync(
+        path.resolve(currentDir, './package-to-transpile'),
+        path.resolve(process.cwd(), './node_modules/package-to-transpile')
+      );
+    });
+    afterAll(() => {
+      fs.removeSync(
+        path.resolve(process.cwd(), './node_modules/package-to-transpile')
+      );
+    });
+  }
+);
diff --git a/__tests__/features/copy-webpack.spec.ts b/__tests__/features/copy-webpack.spec.ts
@@ -0,0 +1,15 @@
+import { testFeature } from '../utils/feature';
+import fs from 'fs-extra';
+import path from 'path';
+
+testFeature('copy-webpack', currentDir => {
+  const logoPath = path.resolve(currentDir, './public/images/logo.png');
+
+  afterAll(() => {
+    fs.removeSync(path.resolve(currentDir, './public'));
+  });
+
+  test('should copy images in resources folder to public folder', () => {
+    expect(fs.existsSync(logoPath)).toBeTruthy();
+  });
+});