Skip to content

Commit

Permalink
fix(webpack-cli): fixed support for SCSS entry points (#1271)
Browse files Browse the repository at this point in the history
* fix(webpack-cli): fixed support for SCSS entry points

* fix(webpack-cli): use children only when configuration is an array

* fix(webpack-cli): added tests correctly

* fix(webpack-cli): increased time out for installing deps

* tests(webpack-cli): enforced time out

* tests(webpack-cli): fix correct cwd when installing deps

* tests(webpack-cli): fix correct cwd when installing deps

* tests(webpack-cli): install all packages before launching the tests
  • Loading branch information
ematipico committed Feb 28, 2020
1 parent afe97f6 commit 321bbe5
Show file tree
Hide file tree
Showing 14 changed files with 190 additions and 48 deletions.
1 change: 1 addition & 0 deletions jest.config.js
Original file line number Diff line number Diff line change
Expand Up @@ -9,4 +9,5 @@ module.exports = {
},
testRegex: ['/__tests__/.*\\.(test.js|test.ts)$', '/test/.*\\.(test.js|test.ts)$'],
moduleFileExtensions: ['ts', 'js', 'json'],
watchPlugins: ['jest-watch-typeahead/filename', 'jest-watch-typeahead/testname'],
};
4 changes: 3 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -25,13 +25,14 @@
"scripts": {
"bootstrap": "lerna bootstrap",
"build": "node scripts/buildPackages.js",
"prepsuite": "node scripts/prepareSuite.js",
"clean:all": "rimraf node_modules packages/*/{node_modules}",
"commit": "git-cz",
"docs": "typedoc",
"format": "eslint --fix . --ext .js,.ts",
"lint": "eslint . --ext .js,.ts",
"lint:fix": "eslint . --ext .js,.ts --fix",
"pretest": "yarn build && yarn lint",
"pretest": "yarn build && yarn lint && yarn prepsuite",
"reportCoverage": "nyc report --reporter=json && codecov -f coverage/coverage-final.json --disable=gcov",
"smoketest": "smoketests/smoketests.sh",
"test": "nyc jest --maxWorkers=4 --reporters=default --reporters=jest-junit",
Expand Down Expand Up @@ -150,6 +151,7 @@
"jest": "^25.1.0",
"jest-junit": "^10.0.0",
"jest-serializer-ansi": "^1.0.3",
"jest-watch-typeahead": "^0.4.2",
"lerna": "^3.20.2",
"lint-staged": "^9.4.2",
"nyc": "^14.1.1",
Expand Down
4 changes: 3 additions & 1 deletion packages/webpack-cli/lib/utils/Compiler.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,6 +6,7 @@ const { CompilerOutput } = require('./CompilerOutput');
class Compiler {
constructor() {
this.output = new CompilerOutput();
this.compilerOptions = {};
}
setUpHookForCompilation(compilation, outputOptions, options) {
const { ProgressPlugin } = webpack;
Expand Down Expand Up @@ -81,7 +82,7 @@ class Compiler {
this.output.generateRawOutput(stats);
} else {
const statsObj = stats.toJson(outputOptions);
if (statsObj.children && statsObj.children.length) {
if (statsObj.children && Array.isArray(statsObj.children) && this.compilerOptions && Array.isArray(this.compilerOptions)) {
statsObj.children.forEach(child => {
this.output.generateFancyOutput(child, statsErrors, processingMessageBuffer);
});
Expand Down Expand Up @@ -146,6 +147,7 @@ class Compiler {
async createCompiler(options) {
try {
this.compiler = await webpack(options);
this.compilerOptions = options;
} catch (err) {
process.stdout.write('\n');
logger.error(`${err.name}: ${err.message}`);
Expand Down
66 changes: 34 additions & 32 deletions packages/webpack-cli/lib/utils/CompilerOutput.js
Original file line number Diff line number Diff line change
Expand Up @@ -32,38 +32,40 @@ class CompilerOutput {
const asset = assets.find(asset => {
return asset.name === assetName;
});
const entrypointChunks = entrypoint.chunks.map(id => {
return chunks.find(chunk => chunk.id === id);
});

const chunksOutput = this._createChunksOutput(entrypointChunks);
const kbSize = `${(asset.size / 1000).toFixed(2)} kb`;
const hasBeenCompiled = asset.comparedForEmit;
const bundleTbl = new Table({
chars: {
top: '',
'top-mid': '',
'top-left': '',
'top-right': '',
bottom: '',
'bottom-mid': '',
'bottom-left': '',
'bottom-right': '',
left: '',
'left-mid': '',
mid: '',
'mid-mid': '',
right: '',
'right-mid': '',
},
style: { compact: true },
});
bundleTbl.push({ 'Bundle Name': asset.name });
bundleTbl.push({ 'Compared For Emit': hasBeenCompiled });
bundleTbl.push({ 'Bundle size': kbSize });
const bundleOutput = bundleTbl.toString() + `\n\nModules:\n${chunksOutput}`;
assetsTble.push([entrypoint.name, bundleOutput]);
compilationTableEmpty = false;
if (asset) {
const entrypointChunks = entrypoint.chunks.map(id => {
return chunks.find(chunk => chunk.id === id);
});

const chunksOutput = this._createChunksOutput(entrypointChunks);
const kbSize = `${(asset.size / 1000).toFixed(2)} kb`;
const hasBeenCompiled = asset.comparedForEmit;
const bundleTbl = new Table({
chars: {
top: '',
'top-mid': '',
'top-left': '',
'top-right': '',
bottom: '',
'bottom-mid': '',
'bottom-left': '',
'bottom-right': '',
left: '',
'left-mid': '',
mid: '',
'mid-mid': '',
right: '',
'right-mid': '',
},
style: { compact: true },
});
bundleTbl.push({ 'Bundle Name': asset.name });
bundleTbl.push({ 'Compared For Emit': hasBeenCompiled });
bundleTbl.push({ 'Bundle size': kbSize });
const bundleOutput = bundleTbl.toString() + `\n\nModules:\n${chunksOutput}`;
assetsTble.push([entrypoint.name, bundleOutput]);
compilationTableEmpty = false;
}
});
});

Expand Down
53 changes: 53 additions & 0 deletions scripts/prepareSuite.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,53 @@
'use strict';

const fs = require('fs');
const path = require('path');
// eslint-disable-next-line node/no-unpublished-require
const execa = require('execa');
// eslint-disable-next-line node/no-unpublished-require
const chalk = require('chalk');

const BASE_DIR = 'test/';
const PACKAGE = 'package.json';

function collectTestingFoldersWithPackage() {
const testFolder = path.resolve(path.join(process.cwd(), BASE_DIR));

return extractFolder(testFolder);
}

function extractFolder(folderToRead, folders = []) {
const files = fs.readdirSync(folderToRead);

files.forEach(file => {
const filePath = path.resolve(path.join(folderToRead, file));
const stats = fs.statSync(filePath);
if (stats.isFile() && file === PACKAGE) {
folders.push(folderToRead);
}
if (stats.isDirectory() && file !== 'node_modules') {
extractFolder(filePath, folders);
}
});

return folders;
}

{
Promise.all(
collectTestingFoldersWithPackage().map(async folder => {
return execa('yarn', {
cwd: folder,
stdio: 'inherit',
});
}),
)
.then(() => {
console.log(chalk.inverse.green(' Successfully prepared the test suite '));
})
.catch(e => {
console.error(chalk.inverse.red(' Unable to prepare the test suite '));
console.error(e.stack);
process.exitCode = 1;
});
}
3 changes: 3 additions & 0 deletions test/entry/scss/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,3 @@
yarn.lock
package-lock.json
node_modules/
1 change: 1 addition & 0 deletions test/entry/scss/home.js
Original file line number Diff line number Diff line change
@@ -0,0 +1 @@
console.log('home');
6 changes: 6 additions & 0 deletions test/entry/scss/home.scss
Original file line number Diff line number Diff line change
@@ -0,0 +1,6 @@
body {
font-size: 100%;
body {
background-color: red;
}
}
9 changes: 9 additions & 0 deletions test/entry/scss/package.json
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
{
"dependencies": {
"css-loader": "^3.4.2",
"style-loader": "^1.1.3",
"sass-loader": "^8.0.2",
"mini-css-extract-plugin": "^0.9.0",
"node-sass": "^4.13.1"
}
}
15 changes: 15 additions & 0 deletions test/entry/scss/scss.test.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
/* eslint-disable node/no-missing-require */
/* eslint-disable node/no-unpublished-require */
const { run, runInstall } = require('../../utils/test-utils');

jest.setTimeout(1000 * 60 * 5);

describe('entry point', () => {
it('should support SCSS files', async () => {
await runInstall(__dirname);
const { stdout } = run(__dirname);
expect(stdout).toBeTruthy();
expect(stdout).toContain('home.scss');
expect(stdout).toContain('home.js');
});
});
30 changes: 30 additions & 0 deletions test/entry/scss/webpack.config.js
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
/* eslint-disable node/no-missing-require */
const MiniCssExtractPlugin = require('mini-css-extract-plugin');

module.exports = {
mode: 'production',
entry: {
home: ['./home.js', './home.scss'],
},
output: {
filename: '[name].js',
},
module: {
rules: [
{
test: /\.scss$/,
use: [
// fallback to style-loader in development
MiniCssExtractPlugin.loader,
'css-loader',
'sass-loader',
],
},
],
},
plugins: [
new MiniCssExtractPlugin({
filename: '[name].css',
}),
],
};
2 changes: 0 additions & 2 deletions test/typescript/.gitignore
Original file line number Diff line number Diff line change
@@ -1,5 +1,3 @@
yarn.lock
package-lock.json
node_modules/
*.js
*.js.map
29 changes: 18 additions & 11 deletions test/typescript/typescript.test.js
Original file line number Diff line number Diff line change
@@ -1,17 +1,24 @@
// eslint-disable-next-line node/no-unpublished-require
/* eslint-disable node/no-missing-require */
/* eslint-disable node/no-unpublished-require */
const { run, runInstall } = require('../utils/test-utils');
const { stat } = require('fs');
const { resolve } = require('path');

jest.setTimeout(1000 * 60 * 5);

describe('webpack cli', () => {
it('should support typescript file', async () => {
await runInstall(__dirname);
const { stderr, stdout } = run(__dirname, ['-c', './webpack.config.ts']);
expect(stderr).toBeFalsy();
expect(stdout).toBeTruthy();
stat(resolve(__dirname, 'bin/foo.bundle.js'), (err, stats) => {
expect(err).toBe(null);
expect(stats.isFile()).toBe(true);
});
});
it(
'should support typescript file',
async () => {
await runInstall(__dirname);
const { stderr, stdout } = run(__dirname, ['-c', './webpack.config.ts']);
expect(stderr).toBeFalsy();
expect(stdout).toBeTruthy();
stat(resolve(__dirname, 'bin/foo.bundle.js'), (err, stats) => {
expect(err).toBe(null);
expect(stats.isFile()).toBe(true);
});
},
1000 * 60 * 5,
);
});
15 changes: 14 additions & 1 deletion yarn.lock
Original file line number Diff line number Diff line change
Expand Up @@ -7984,7 +7984,20 @@ jest-validate@^25.1.0:
leven "^3.1.0"
pretty-format "^25.1.0"

jest-watcher@^24.9.0:
jest-watch-typeahead@^0.4.2:
version "0.4.2"
resolved "https://registry.yarnpkg.com/jest-watch-typeahead/-/jest-watch-typeahead-0.4.2.tgz#e5be959698a7fa2302229a5082c488c3c8780a4a"
integrity sha512-f7VpLebTdaXs81rg/oj4Vg/ObZy2QtGzAmGLNsqUS5G5KtSN68tFcIsbvNODfNyQxU78g7D8x77o3bgfBTR+2Q==
dependencies:
ansi-escapes "^4.2.1"
chalk "^2.4.1"
jest-regex-util "^24.9.0"
jest-watcher "^24.3.0"
slash "^3.0.0"
string-length "^3.1.0"
strip-ansi "^5.0.0"

jest-watcher@^24.3.0, jest-watcher@^24.9.0:
version "24.9.0"
resolved "https://registry.yarnpkg.com/jest-watcher/-/jest-watcher-24.9.0.tgz#4b56e5d1ceff005f5b88e528dc9afc8dd4ed2b3b"
integrity sha512-+/fLOfKPXXYJDYlks62/4R4GoT+GU1tYZed99JSCOsmzkkF7727RqKrjNAxtfO4YpGv11wybgRvCjR73lK2GZw==
Expand Down

0 comments on commit 321bbe5

Please sign in to comment.