refactor: SyntaxError and Warning

Author: alexander-akait

src/SyntaxError.js

@@ -1,24 +1,24 @@
 import formatCodeFrame from 'babel-code-frame';
 
 export default class SyntaxError extends Error {
-  constructor(err) {
-    super(err);
+  constructor(error) {
+    super(error);
 
-    this.name = 'Syntax Error';
-    this.message = err.reason ? err.reason : err.message;
+    const { reason, message, line, column, source } = error;
 
-    if (err.line && err.column) {
-      this.message += ` (${err.line}:${err.column})`;
+    this.name = 'SyntaxError';
+    this.message = reason || message;
 
-      if (err.source) {
-        this.message += `\n\n${formatCodeFrame(
-          err.source,
-          err.line,
-          err.column
-        )}\n`;
+    if (line && column) {
+      this.message += ` (${line}:${column})`;
+
+      if (source) {
+        this.message += `\n\n${formatCodeFrame(source, line, column)}\n`;
       }
     }
 
-    Error.captureStackTrace(this, this.constructor);
+    if (Error.captureStackTrace) {
+      Error.captureStackTrace(this, this.constructor);
+    }
   }
 }

src/Warning.js

@@ -0,0 +1,12 @@
+export default class Warning extends Error {
+  constructor(warning) {
+    super(warning);
+
+    this.name = 'Warning';
+    this.message = warning.toString();
+
+    if (Error.captureStackTrace) {
+      Error.captureStackTrace(this, this.constructor);
+    }
+  }
+}

src/index.js

@@ -14,6 +14,7 @@ import postcss from 'postcss';
 
 import schema from './options.json';
 import plugin from './plugin';
+import Warning from './Warning';
 import SyntaxError from './SyntaxError';
 
 let runtimeFile = require.resolve('./runtime');
@@ -94,7 +95,9 @@ export default function loader(content, map, meta) {
   postcss(plugins)
     .process(contentOrAst, postcssOptions)
     .then((result) => {
-      result.warnings().forEach((msg) => this.emitWarning(msg.toString()));
+      result
+        .warnings()
+        .forEach((warning) => this.emitWarning(new Warning(warning)));
 
       if (meta && meta.messages) {
         // eslint-disable-next-line no-param-reassign

test/SyntaxError.test.js

@@ -1,5 +1,7 @@
 import SyntaxError from '../src/SyntaxError';
 
+import webpack from './helpers/compiler';
+
 describe('SyntaxError', () => {
   test('basic', () => {
     expect(new SyntaxError(new Error()).toString()).toMatchSnapshot();
@@ -36,4 +38,11 @@ describe('SyntaxError', () => {
       new SyntaxError(errorWithLineAndColumnAndSource).toString()
     ).toMatchSnapshot();
   });
+
+  test('integration', async () => {
+    const stats = await webpack('broken.js');
+
+    expect(stats.compilation.warnings).toMatchSnapshot('warnings');
+    expect(stats.compilation.errors).toMatchSnapshot('errors');
+  });
 });

test/__snapshots__/SyntaxError.test.js.snap

@@ -1,21 +1,37 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`SyntaxError basic 1`] = `"Syntax Error"`;
+exports[`SyntaxError basic 1`] = `"SyntaxError"`;
 
-exports[`SyntaxError basic 2`] = `"Syntax Error: message"`;
+exports[`SyntaxError basic 2`] = `"SyntaxError: message"`;
 
-exports[`SyntaxError basic 3`] = `"Syntax Error: message"`;
+exports[`SyntaxError basic 3`] = `"SyntaxError: message"`;
 
-exports[`SyntaxError basic 4`] = `"Syntax Error: message"`;
+exports[`SyntaxError basic 4`] = `"SyntaxError: message"`;
 
-exports[`SyntaxError basic 5`] = `"Syntax Error: reason"`;
+exports[`SyntaxError basic 5`] = `"SyntaxError: reason"`;
 
-exports[`SyntaxError basic 6`] = `"Syntax Error: message (1:1)"`;
+exports[`SyntaxError basic 6`] = `"SyntaxError: message (1:1)"`;
 
 exports[`SyntaxError basic 7`] = `
-"Syntax Error: message (1:1)
+"SyntaxError: message (1:1)
 
 > 1 | .class { invalid }
     | ^
 "
 `;
+
+exports[`SyntaxError integration: errors 1`] = `
+Array [
+  [ModuleBuildError: Module build failed (from /home/evilebottnawi/IdeaProjects/css-loader/src/index.js):
+SyntaxError: Unknown word (2:3)
+
+  1 | .some {
+> 2 |   invalid css;
+    |   ^
+  3 | }
+  4 | 
+],
+]
+`;
+
+exports[`SyntaxError integration: warnings 1`] = `Array []`;

test/__snapshots__/import-option.test.js.snap

@@ -225,7 +225,7 @@ exports[`import true from modules: warnings 1`] = `Array []`;
 exports[`import true invalid: errors 1`] = `
 Array [
   [ModuleBuildError: Module build failed (from /home/evilebottnawi/IdeaProjects/css-loader/src/index.js):
-Syntax Error: Unexpected format  (1:1)
+SyntaxError: Unexpected format  (1:1)
 
 > 1 | @import;
     | ^

test/__snapshots__/loader.test.js.snap

@@ -176,9 +176,9 @@ module.exports = function escape(url) {
 
 exports[`loader basic: warnings 1`] = `Array []`;
 
-exports[`loader empty: errors 1`] = `Array []`;
+exports[`loader empty options: errors 1`] = `Array []`;
 
-exports[`loader empty: module 1`] = `
+exports[`loader empty options: module 1`] = `
 Array [
   Array [
     1,
@@ -188,7 +188,7 @@ Array [
 ]
 `;
 
-exports[`loader empty: warnings 1`] = `Array []`;
+exports[`loader empty options: warnings 1`] = `Array []`;
 
 exports[`loader error when no loader for url assets: errors 1`] = `
 Array [
@@ -200,22 +200,6 @@ You may need an appropriate loader to handle this file type.
 
 exports[`loader error when no loader for url assets: warnings 1`] = `Array []`;
 
-exports[`loader error when source code is invalid: errors 1`] = `
-Array [
-  [ModuleBuildError: Module build failed (from /home/evilebottnawi/IdeaProjects/css-loader/src/index.js):
-Syntax Error: Unknown word (2:3)
-
-  1 | .some {
-> 2 |   invalid css;
-    |   ^
-  3 | }
-  4 | 
-],
-]
-`;
-
-exports[`loader error when source code is invalid: warnings 1`] = `Array []`;
-
 exports[`loader using together with "postcss-loader" (reuse ast): errors 1`] = `Array []`;
 
 exports[`loader using together with "postcss-loader" (reuse ast): module 1`] = `

test/__snapshots__/validation-errors.test.js.snap

@@ -16,7 +16,7 @@ ValidationError: CSS Loader Invalid Options
 options.import should be boolean
 
     at validateOptions (/home/evilebottnawi/IdeaProjects/css-loader/node_modules/schema-utils/src/validateOptions.js:32:11)
-    at Object.loader (/home/evilebottnawi/IdeaProjects/css-loader/src/index.js:29:3)],
+    at Object.loader (/home/evilebottnawi/IdeaProjects/css-loader/src/index.js:30:3)],
 ]
 `;
 
@@ -38,7 +38,7 @@ ValidationError: CSS Loader Invalid Options
 options.importLoaders should be number
 
     at validateOptions (/home/evilebottnawi/IdeaProjects/css-loader/node_modules/schema-utils/src/validateOptions.js:32:11)
-    at Object.loader (/home/evilebottnawi/IdeaProjects/css-loader/src/index.js:29:3)],
+    at Object.loader (/home/evilebottnawi/IdeaProjects/css-loader/src/index.js:30:3)],
 ]
 `;
 
@@ -60,7 +60,7 @@ ValidationError: CSS Loader Invalid Options
 options.sourceMap should be boolean
 
     at validateOptions (/home/evilebottnawi/IdeaProjects/css-loader/node_modules/schema-utils/src/validateOptions.js:32:11)
-    at Object.loader (/home/evilebottnawi/IdeaProjects/css-loader/src/index.js:29:3)],
+    at Object.loader (/home/evilebottnawi/IdeaProjects/css-loader/src/index.js:30:3)],
 ]
 `;
 
@@ -74,7 +74,7 @@ ValidationError: CSS Loader Invalid Options
 options should NOT have additional properties
 
     at validateOptions (/home/evilebottnawi/IdeaProjects/css-loader/node_modules/schema-utils/src/validateOptions.js:32:11)
-    at Object.loader (/home/evilebottnawi/IdeaProjects/css-loader/src/index.js:29:3)],
+    at Object.loader (/home/evilebottnawi/IdeaProjects/css-loader/src/index.js:30:3)],
 ]
 `;
 
@@ -96,7 +96,7 @@ ValidationError: CSS Loader Invalid Options
 options.url should be boolean
 
     at validateOptions (/home/evilebottnawi/IdeaProjects/css-loader/node_modules/schema-utils/src/validateOptions.js:32:11)
-    at Object.loader (/home/evilebottnawi/IdeaProjects/css-loader/src/index.js:29:3)],
+    at Object.loader (/home/evilebottnawi/IdeaProjects/css-loader/src/index.js:30:3)],
 ]
 `;
 

test/loader.test.js

@@ -18,7 +18,7 @@ describe('loader', () => {
     expect(stats.compilation.errors).toMatchSnapshot('errors');
   });
 
-  test('empty', async () => {
+  test('empty options', async () => {
     const stats = await webpack('empty.js');
     const [, module] = stats.toJson().modules;
 
@@ -28,13 +28,6 @@ describe('loader', () => {
     expect(stats.compilation.errors).toMatchSnapshot('errors');
   });
 
-  test('error when source code is invalid', async () => {
-    const stats = await webpack('broken.js');
-
-    expect(stats.compilation.warnings).toMatchSnapshot('warnings');
-    expect(stats.compilation.errors).toMatchSnapshot('errors');
-  });
-
   test('error when no loader for url assets', async () => {
     const config = {
       rules: [