From 988545c638b71de6897b60824139f73c1789fda0 Mon Sep 17 00:00:00 2001 From: Sheng Di Date: Tue, 20 Jun 2017 10:35:50 -0700 Subject: [PATCH] # This is a combination of 3 commits. # This is the 1st commit message: update travis # The commit message #2 will be skipped: # add traivs env # The commit message #3 will be skipped: # add traivs env --- .travis.yml | 3 ++ .../config/archetype.js | 8 ++-- .../config/karma/browser-settings.js | 37 +++++++++++++++++++ .../config/karma/karma.conf.dev.js | 26 ++----------- .../config/karma/karma.conf.js | 27 ++------------ .../config/webpack/partial/extract-style.js | 6 +-- .../generators/app/templates/clap.js | 36 +++++++++++------- 7 files changed, 77 insertions(+), 66 deletions(-) create mode 100644 packages/electrode-archetype-react-app-dev/config/karma/browser-settings.js diff --git a/.travis.yml b/.travis.yml index 8923248739..05359dc808 100644 --- a/.travis.yml +++ b/.travis.yml @@ -10,3 +10,6 @@ notifications: before_install: - if [[ `npm -v` != 3* ]]; then npm i -g npm@3; npm --version; fi - npm install -g xclap-cli + - export CHROME_BIN=chromium-browser + - export DISPLAY=:99.0 + - sh -e /etc/init.d/xvfb start diff --git a/packages/electrode-archetype-react-app-dev/config/archetype.js b/packages/electrode-archetype-react-app-dev/config/archetype.js index 43b4904896..0578952742 100644 --- a/packages/electrode-archetype-react-app-dev/config/archetype.js +++ b/packages/electrode-archetype-react-app-dev/config/archetype.js @@ -27,9 +27,11 @@ module.exports = { }, archetypeOptions.webpack ), - karma: Object.assign({}, { - enableChromeHeadless: process.env.ENABLE_CHROME_HEADLESS - }), + karma: Object.assign( + {}, + { browser: process.env.KARMA_BROWSER === undefined ? "chrome" : process.env.KARMA_BROWSER }, + archetypeOptions.karma + ), config: Object.assign( {}, { diff --git a/packages/electrode-archetype-react-app-dev/config/karma/browser-settings.js b/packages/electrode-archetype-react-app-dev/config/karma/browser-settings.js new file mode 100644 index 0000000000..67620d0072 --- /dev/null +++ b/packages/electrode-archetype-react-app-dev/config/karma/browser-settings.js @@ -0,0 +1,37 @@ +"use strict"; + +const archetype = require("electrode-archetype-react-app/config/archetype"); +const logger = require("electrode-archetype-react-app/lib/logger"); + +module.exports = function(settings) { + const browser = archetype.karma.browser.toLowerCase(); + if (browser === "chrome") { + settings.browsers = ["Chrome", "Chrome_without_security"]; + settings.customLaunchers = { + Chrome_without_security: { + base: "Chrome", + flags: ["--disable-web-security"] + }, + Chrome_travis_ci: { + base: "Chrome", + flags: ["--no-sandbox"] + } + }; + logger.info("Using Chrome Headless to run Karma test"); + + if (process.env.TRAVIS) { + settings.browsers = ["Chrome_travis_ci"]; + } + } else if (browser === "phantomjs") { + settings.frameworks.push("phantomjs-shim"); + settings.browser = ["PhantomJS"]; + logger.warn( + "Using PhantomJS to run Karma test. It's been deprecated and may be removed in the future." + ); + } else { + logger.error(`Unknown browser ${browser} set for Karma test. Failed.`); + return process.exit(1); + } + + return settings; +}; diff --git a/packages/electrode-archetype-react-app-dev/config/karma/karma.conf.dev.js b/packages/electrode-archetype-react-app-dev/config/karma/karma.conf.dev.js index 3a57a84449..cc9d51a61c 100644 --- a/packages/electrode-archetype-react-app-dev/config/karma/karma.conf.dev.js +++ b/packages/electrode-archetype-react-app-dev/config/karma/karma.conf.dev.js @@ -10,11 +10,11 @@ const loadUserConfig = require("./util/load-user-config"); const Path = require("path"); -const logger = require("electrode-archetype-react-app/lib/logger"); -const archetype = require("electrode-archetype-react-app/config/archetype"); +const browserSettings = require("./browser-settings"); module.exports = function(config) { const settings = { + frameworks: ["mocha"], reporters: ["spec"], basePath: process.cwd(), // repository root. files: [ @@ -31,26 +31,6 @@ module.exports = function(config) { } }; - if (archetype.karma.enableChromeHeadless) { - Object.assign(settings, { - frameworks: ["mocha"], - browsers: ["Chrome", "Chrome_without_security"], - customLaunchers: { - Chrome_without_security: { // eslint-disable-line camelcase - base: "Chrome", - flags: ["--disable-web-security"] - } - } - }); - } else { - Object.assign(settings, { - frameworks: ["mocha", "phantomjs-shim"], - browsers: ["PhantomJS"] - }); - - // eslint-disable-next-line max-len - logger.warn("PhantomJS has been deprecated, to use chrome headless, please set env 'ENABLE_CHROME_HEADLESS' to true."); - } - + browserSettings(settings); loadUserConfig(Path.basename(__filename), config, settings); }; diff --git a/packages/electrode-archetype-react-app-dev/config/karma/karma.conf.js b/packages/electrode-archetype-react-app-dev/config/karma/karma.conf.js index db449bb576..8552bcaabd 100644 --- a/packages/electrode-archetype-react-app-dev/config/karma/karma.conf.js +++ b/packages/electrode-archetype-react-app-dev/config/karma/karma.conf.js @@ -10,15 +10,14 @@ const PREPROCESSORS = {}; const loadUserConfig = require("./util/load-user-config"); -const logger = require("electrode-archetype-react-app/lib/logger"); -const archetype = require("electrode-archetype-react-app/config/archetype"); +const browserSettings = require("./browser-settings"); PREPROCESSORS[MAIN_PATH] = ["webpack", "sourcemap"]; module.exports = function(config) { const settings = { basePath: process.cwd(), - frameworks: ["mocha", "phantomjs-shim", "intl-shim"], + frameworks: ["mocha", "intl-shim"], files: [MAIN_PATH], plugins: [ "karma-chrome-launcher", @@ -66,26 +65,6 @@ module.exports = function(config) { singleRun: true }; - if (archetype.karma.enableChromeHeadless) { - Object.assign(settings, { - frameworks: ["mocha", "intl-shim"], - browsers: ["Chrome", "Chrome_without_security"], - customLaunchers: { - Chrome_without_security: { // eslint-disable-line camelcase - base: "Chrome", - flags: ["--disable-web-security"] - } - } - }); - } else { - Object.assign(settings, { - frameworks: ["mocha", "phantomjs-shim", "intl-shim"], - browsers: ["PhantomJS"] - }); - - // eslint-disable-next-line max-len - logger.warn("PhantomJS has been deprecated, to use chrome headless, please set env 'ENABLE_CHROME_HEADLESS' to true."); - } - + browserSettings(settings); loadUserConfig(Path.basename(__filename), config, settings); }; diff --git a/packages/electrode-archetype-react-app-dev/config/webpack/partial/extract-style.js b/packages/electrode-archetype-react-app-dev/config/webpack/partial/extract-style.js index 7d92790516..bad2d4610b 100644 --- a/packages/electrode-archetype-react-app-dev/config/webpack/partial/extract-style.js +++ b/packages/electrode-archetype-react-app-dev/config/webpack/partial/extract-style.js @@ -40,11 +40,11 @@ const cssModuleSupport = !stylusExists && cssNextExists; module.exports = function() { const cssModuleStylusSupport = archetype.webpack.cssModuleStylusSupport; - const stylusQuery = cssLoader + "?-autoprefixer!" + stylusLoader; + const stylusQuery = `${cssLoader}?-autoprefixer!${stylusLoader}`; const cssLoaderOptions = "?modules&localIdentName=[name]__[local]___[hash:base64:5]&-autoprefixer"; - const cssQuery = cssLoader + cssLoaderOptions + "!" + postcssLoader; - const cssStylusQuery = cssLoader + cssLoaderOptions + "!" + postcssLoader + "!" + stylusLoader; + const cssQuery = `${cssLoader}${cssLoaderOptions}!${postcssLoader}`; + const cssStylusQuery = `${cssLoader}${cssLoaderOptions}!${postcssLoader}!${stylusLoader}`; // By default, this archetype assumes you are using CSS-Modules + CSS-Next const rules = [ diff --git a/packages/generator-electrode/generators/app/templates/clap.js b/packages/generator-electrode/generators/app/templates/clap.js index 8bfcfbf522..c52acce962 100644 --- a/packages/generator-electrode/generators/app/templates/clap.js +++ b/packages/generator-electrode/generators/app/templates/clap.js @@ -1,24 +1,34 @@ -// Tell Electrode app archetype that you want to use ES6 syntax in your server code +/* + * Tell Electrode app archetype that you want to use ES6 syntax in your server code + */ + process.env.SERVER_ES6 = true; /* - * Enable the following flags for optional features in the Electrode app archetype + * Use PhantomJS to run your Karma Unit tests. Default is "chrome" (Chrome Headless) */ -// Use Chrome Headless instead of PhantomJS to run your Karma Unit tests -// process.env.ENABLE_CHROME_HEADLESS = true; +// process.env.KARMA_BROWSER = "phantomjs"; -// Turn off using electrode-webpack-reporter to show visual report of your webpack -// compile results when running in dev mode with `clap dev` -// process.env.HTML_WEBPACK_REPORTER_OFF = true +/* + * Turn off using electrode-webpack-reporter to show visual report of your webpack + * compile results when running in dev mode with `clap dev` + */ -// Use a custom host name instead of localhost, and a diff port instead of 2992 -// for webpack dev server when running in dev mode with `clap dev` -// process.env.WEBPACK_DEV_HOST = "dev.mymachine.net" -// process.env.WEBPACK_DEV_PORT = 8100 +// process.env.HTML_WEBPACK_REPORTER_OFF = true; -// Enable HTTPS for webpack dev server when running in dev mode with `clap dev` -// process.env.WEBPACK_DEV_HTTPS = true; +/* + * Use a custom host name instead of localhost, and a diff port instead of 2992 + * for webpack dev server when running in dev mode with `clap dev` + */ + +// process.env.WEBPACK_DEV_HOST = "dev.mymachine.net"; +// process.env.WEBPACK_DEV_PORT = 8100; + +/* + * Enable HTTPS for webpack dev server when running in dev mode with `clap dev` + */ +// process.env.WEBPACK_DEV_HTTPS = true; require("electrode-archetype-react-app")();