Merge pull request #1362 from outoftime/validations-async

Move async loading of validations to saga

Author: outoftime

src/sagas/errors.js

@@ -10,8 +10,17 @@ import {
 } from 'redux-saga/effects';
 import Analyzer from '../analyzers';
 import {getCurrentProject} from '../selectors';
-import validations from '../validations';
 import {validatedSource} from '../actions/errors';
+import retryingFailedImports from '../util/retryingFailedImports';
+
+export async function importValidations() {
+  return retryingFailedImports(
+    () => import(
+      /* webpackChunkName: 'mainAsync' */
+      '../validations',
+    ),
+  );
+}
 
 export function* toggleLibrary(tasks) {
   yield call(validateCurrentProject, tasks);
@@ -49,6 +58,7 @@ export function* validateSource(
   if (tasks.has(language)) {
     yield cancel(tasks.get(language));
   }
+  const validations = yield call(importValidations);
   const task = yield fork(validations[language], source, projectAttributes);
   tasks.set(language, task);
   const errors = yield join(task);

src/validations/css/css.js

@@ -1,5 +1,5 @@
+import css from 'css';
 import Validator from '../Validator';
-import retryingFailedImports from '../../util/retryingFailedImports';
 
 const errorMap = {
   'missing \'{\'': () => ({reason: 'missing-opening-curly'}),
@@ -21,10 +21,6 @@ class CssValidator extends Validator {
   }
 
   async _getRawErrors() {
-    const css = await retryingFailedImports(() => import(
-      /* webpackChunkName: 'mainAsync' */
-      'css',
-    ));
     return css.parse(this._source, {silent: true}).stylesheet.parsingErrors;
   }
 

src/validations/css/prettycss.js

@@ -1,7 +1,7 @@
+import prettyCSS from 'PrettyCSS';
 import trim from 'lodash/trim';
 import endsWith from 'lodash/endsWith';
 import Validator from '../Validator';
-import retryingFailedImports from '../../util/retryingFailedImports';
 
 const RADIAL_GRADIENT_EXPR =
   /^(?:(?:-(?:ms|moz|o|webkit)-)?radial-gradient|-webkit-gradient)/;
@@ -133,10 +133,6 @@ class PrettyCssValidator extends Validator {
   }
 
   async _getRawErrors() {
-    const prettyCSS = await retryingFailedImports(() => import(
-      /* webpackChunkName: 'mainAsync' */
-      'PrettyCSS',
-    ));
     try {
       const result = prettyCSS.parse(this._source);
       return result.getProblems();

src/validations/css/stylelint.js

@@ -1,5 +1,5 @@
+import stylelint from '../../util/minimalStylelint';
 import Validator from '../Validator';
-import retryingFailedImports from '../../util/retryingFailedImports';
 
 const errorMap = {
   'syntaxError/Unclosed block': () => ({
@@ -21,10 +21,6 @@ class StyleLintValidator extends Validator {
   }
 
   async _getRawErrors() {
-    const {'default': stylelint} = await retryingFailedImports(() => import(
-      /* webpackChunkName: 'mainAsync' */
-      '../../util/minimalStylelint',
-    ));
     let result;
     try {
       result = await stylelint(this._source);

src/validations/html/htmlInspector.js

@@ -1,8 +1,8 @@
+import HTMLInspector from 'html-inspector';
 import last from 'lodash/last';
 import isNull from 'lodash/isNull';
 import trim from 'lodash/trim';
 import {localizedArrayToSentence} from '../../util/arrayToSentence';
-import retryingFailedImports from '../../util/retryingFailedImports';
 import Validator from '../Validator';
 
 const specialCases = {
@@ -82,6 +82,11 @@ function noListsWithTextChildrenValidator(listener, reporter) {
   });
 }
 
+HTMLInspector.rules.add(
+  'validate-list-children',
+  noListsWithTextChildrenValidator,
+);
+
 class HtmlInspectorValidator extends Validator {
   constructor(source) {
     super(source, 'html', errorMap);
@@ -93,16 +98,6 @@ class HtmlInspectorValidator extends Validator {
       return Promise.resolve([]);
     }
 
-    const HTMLInspector = await retryingFailedImports(() => import(
-      /* webpackChunkName: 'mainAsync' */
-      'html-inspector',
-    ));
-
-    HTMLInspector.rules.add(
-      'validate-list-children',
-      noListsWithTextChildrenValidator,
-    );
-
     return new Promise((resolve) => {
       HTMLInspector.inspect({
         domRoot: this._doc.documentElement,

src/validations/html/htmllint.js

@@ -1,8 +1,8 @@
 import clone from 'lodash/clone';
 import defaults from 'lodash/defaults';
+import {Linter, rules} from 'htmllint';
 import reduce from 'lodash/reduce';
 import Validator from '../Validator';
-import retryingFailedImports from '../../util/retryingFailedImports';
 
 const errorMap = {
   E001: (error) => {
@@ -135,25 +135,19 @@ const htmlLintOptions = {
   'title-no-dup': true,
 };
 
+const linter = new Linter(rules);
+const options = reduce(
+  linter.rules.options,
+  (acc, {name}) => defaults(acc, {[name]: false}),
+  clone(htmlLintOptions),
+);
+
 class HtmllintValidator extends Validator {
   constructor(source) {
     super(source, 'html', errorMap);
   }
 
   async _getRawErrors() {
-    const {Linter, rules} = await retryingFailedImports(
-      () => import(
-        /* webpackChunkName: 'mainAsync' */
-        'htmllint',
-      ),
-    );
-    const linter = new Linter(rules);
-    const options = reduce(
-      linter.rules.options,
-      (acc, {name}) => defaults(acc, {[name]: false}),
-      clone(htmlLintOptions),
-    );
-
     try {
       const results = await linter.lint(this._source, options);
       return results;

src/validations/html/slowparse.js

@@ -1,5 +1,5 @@
+import Slowparse from '../../util/slowparse';
 import Validator from '../Validator';
-import retryingFailedImports from '../../util/retryingFailedImports';
 
 const errorMap = {
   ATTRIBUTE_IN_CLOSING_TAG: error => ({
@@ -125,10 +125,6 @@ class SlowparseValidator extends Validator {
   }
 
   async _getRawErrors() {
-    const {'default': Slowparse} = await retryingFailedImports(() => import(
-      /* webpackChunkName: 'mainAsync' */
-      '../../util/slowparse',
-    ));
     let error;
     try {
       ({error} = Slowparse.HTML(document, this._source, {errorDetectors}));

src/validations/index.js

@@ -2,4 +2,4 @@ import html from './html';
 import css from './css';
 import javascript from './javascript';
 
-export default {html, css, javascript};
+export {html, css, javascript};

src/validations/javascript/esprima.js

@@ -1,7 +1,7 @@
+import esprima from 'esprima';
 import find from 'lodash/find';
 import inRange from 'lodash/inRange';
 import Validator from '../Validator';
-import retryingFailedImports from '../../util/retryingFailedImports';
 
 const UNEXPECTED_TOKEN_EXPR = /^Unexpected token (.+)$/;
 
@@ -79,10 +79,6 @@ class EsprimaValidator extends Validator {
   }
 
   async _getRawErrors() {
-    const esprima = await retryingFailedImports(() => import(
-      /* webpackChunkName: 'mainAsync' */
-      'esprima',
-    ));
     try {
       esprima.parse(this._source);
     } catch (error) {

src/validations/javascript/jshint.js

@@ -5,8 +5,8 @@ import compact from 'lodash/compact';
 import defaults from 'lodash/defaults';
 import find from 'lodash/find';
 import includes from 'lodash/includes';
+import {JSHINT as jshint} from 'jshint';
 import libraries from '../../config/libraries';
-import retryingFailedImports from '../../util/retryingFailedImports';
 import Validator from '../Validator';
 
 const jshintrc = {
@@ -171,10 +171,6 @@ class JsHintValidator extends Validator {
   }
 
   async _getRawErrors() {
-    const {JSHINT: jshint} = await retryingFailedImports(() => import(
-      /* webpackChunkName: 'mainAsync' */
-      'jshint',
-    ));
     try {
       jshint(this._source, this._jshintOptions);
     } catch (e) {