canvas-lms/webpack.test.config.js

51 lines
1.9 KiB
JavaScript
Raw Normal View History

process.env.NODE_ENV = 'test'
Webpack: better handling of chunks and cdn stuff fixes: CNVS-31779 [webpack] bundle file size test plan: * using webpack, look at the network panel in the chrome developer console. * the total ammount of javascript loaded for any given page should be much less than before this commit and about on par with what requireJS loads for the same page. * use chrome network panel to throttle to "Regular 3G" * from both a clean cache and a primed cache: * make sure that the total time to render the page is about on par with requireJS first change: load webpack chunks from CDN fixes: CNVS-32261 test plan: * run `npm run webpack-production` * check your page, it should load js files and chunks from the same hostname the page is served from. * now set a host: in config/canvas_cdn.yml (for testing locally, I just set it to http://127.0.0.1:3000, * restart rails and reload the page, now the scripts and chucks should come from that new hostname second change:include fingerprints in webpack bundle and chunk filenames closes: CNVS-28628 with this change we don't need to run `gulp rev` after running webpack and we can load both the bundle and chunk files safely from the cdn, since they will have content-based fingerprints so we can tell browsers to cache them forever. (we set those http caching headers in lib/canvas/cdn/s3_uploader.rb:53) test plan: * for both dev and production * run `npm run webpack` (or `npm run wepack-production`) * with a cdn configured in canvas_cdn.yml, run: RAILS_ENV=<dev or prod> bundle exec rake canvas:cdn:upload_to_s3 * check to make sure that the page loads the webpack js, that there are no errors, and it all came from the cdn third change: properly handle moment locale & timezone in webpack test plan: (see application_helper_spec.rb) * set a non-default user timezone, context timezone and locale * dates should show up in your timezone and and the date helper strings should be in your language better handling of moment custom locales closes: CNVS-33811 since we now have hatian and maori, we need to do this in a way that is not just a one-off for maori test plan: * set your locale to maori * in webpack & requireJS make sure dates show up right Change-Id: I34dbff7d46a1047f9b459d5e1c0d141f435d42fb Reviewed-on: https://gerrit.instructure.com/95737 Reviewed-by: Clay Diffrient <cdiffrient@instructure.com> Tested-by: Jenkins QA-Review: Benjamin Christian Nelson <bcnelson@instructure.com> Product-Review: Ryan Shaw <ryan@instructure.com>
2016-12-13 01:32:11 +08:00
const path = require('path')
const webpack = require('webpack')
const testWebpackConfig = require('./frontend_build/baseWebpackConfig')
const jspecEnv = require('./spec/jspec_env')
eliminate the need to run karma & webpack separately TL;DR: running JS tests in canvas will be a lot faster & simpler What you need to know as a developer writing JS in canvas: Lets say you are working on the “dashboard_cards” feature, just run: `npm run jspec-watch spec/javascripts/jsx/dashboard_card` While you write code and it will have a watcher that catches any changes and re-runs just the dashboar_card specs if you save any file that went into it. It should run & reload in less than a few seconds. You can give it the path to a specific spec file or have it run an entire directory. Or, if you are working on something that might touch a lot of stuff, run: `npm run test-watch` and while you are changing stuff, it will run *all* the QUnit specs on any change. It should only take a couple seconds for webpack to process the file change and to reload the specs in the browser. Jenkins can now just run “npm test” for the webpack build. No need to bundle install then run rake tasks just to run js tests. This change also starts warning you when you have specs that take a long time to run (e.g.: https://cl.ly/2i1O3O0J1504). It turns out we have some *really* slow js specs (like selenium-level slow) so if you notice a slow spec that you our your team wrote, please fix it. Longer details: To test our JS in webpack, we used to 1. run webpack with an env var set so it only does our ember stuff 2. run karma against ember 3. run webpack again against all the rest of the specs canvas 4 run karma again against all the specs in canvas that took a long time. this change makes it so both the ember specs and the specs in the rest of canvas run all in the same karma. it also makes it so karma runs webpack itself. so you don’t need to run `npm run webpack-test && karma start` to run tests, just `npm run test` (which is just an alias to `karma start`). it also means there is now just one watcher (karma) instead of one for both webpack and karma. Closes: CNVS-34977 Test plan: * Jenkins builds should pass * Try running different variations of the commands up there in the description. They should work and be fast-ish. Change-Id: Ia97f9bfa3677763f218f5f02c9463344f180bc6c Reviewed-on: https://gerrit.instructure.com/102169 Reviewed-by: Clay Diffrient <cdiffrient@instructure.com> Tested-by: Jenkins Product-Review: Ryan Shaw <ryan@instructure.com> QA-Review: Ryan Shaw <ryan@instructure.com>
2017-02-14 11:57:26 +08:00
testWebpackConfig.entry = undefined
testWebpackConfig.plugins.push(new webpack.DefinePlugin(jspecEnv))
// These externals are necessary for Enzyme
// See http://airbnb.io/enzyme/docs/guides/webpack.html
Object.assign(testWebpackConfig.externals || (testWebpackConfig.externals = {}), {
'react-dom/server': 'window',
'react/lib/ReactContext': 'true',
'react/lib/ExecutionEnvironment': 'true'
})
Webpack: better handling of chunks and cdn stuff fixes: CNVS-31779 [webpack] bundle file size test plan: * using webpack, look at the network panel in the chrome developer console. * the total ammount of javascript loaded for any given page should be much less than before this commit and about on par with what requireJS loads for the same page. * use chrome network panel to throttle to "Regular 3G" * from both a clean cache and a primed cache: * make sure that the total time to render the page is about on par with requireJS first change: load webpack chunks from CDN fixes: CNVS-32261 test plan: * run `npm run webpack-production` * check your page, it should load js files and chunks from the same hostname the page is served from. * now set a host: in config/canvas_cdn.yml (for testing locally, I just set it to http://127.0.0.1:3000, * restart rails and reload the page, now the scripts and chucks should come from that new hostname second change:include fingerprints in webpack bundle and chunk filenames closes: CNVS-28628 with this change we don't need to run `gulp rev` after running webpack and we can load both the bundle and chunk files safely from the cdn, since they will have content-based fingerprints so we can tell browsers to cache them forever. (we set those http caching headers in lib/canvas/cdn/s3_uploader.rb:53) test plan: * for both dev and production * run `npm run webpack` (or `npm run wepack-production`) * with a cdn configured in canvas_cdn.yml, run: RAILS_ENV=<dev or prod> bundle exec rake canvas:cdn:upload_to_s3 * check to make sure that the page loads the webpack js, that there are no errors, and it all came from the cdn third change: properly handle moment locale & timezone in webpack test plan: (see application_helper_spec.rb) * set a non-default user timezone, context timezone and locale * dates should show up in your timezone and and the date helper strings should be in your language better handling of moment custom locales closes: CNVS-33811 since we now have hatian and maori, we need to do this in a way that is not just a one-off for maori test plan: * set your locale to maori * in webpack & requireJS make sure dates show up right Change-Id: I34dbff7d46a1047f9b459d5e1c0d141f435d42fb Reviewed-on: https://gerrit.instructure.com/95737 Reviewed-by: Clay Diffrient <cdiffrient@instructure.com> Tested-by: Jenkins QA-Review: Benjamin Christian Nelson <bcnelson@instructure.com> Product-Review: Ryan Shaw <ryan@instructure.com>
2016-12-13 01:32:11 +08:00
testWebpackConfig.resolve.alias['spec/jsx'] = path.resolve(__dirname, 'spec/javascripts/jsx')
testWebpackConfig.module.rules.unshift({
test: [
/\/spec\/coffeescripts\//,
/\/spec_canvas\/coffeescripts\//,
Webpack: better handling of chunks and cdn stuff fixes: CNVS-31779 [webpack] bundle file size test plan: * using webpack, look at the network panel in the chrome developer console. * the total ammount of javascript loaded for any given page should be much less than before this commit and about on par with what requireJS loads for the same page. * use chrome network panel to throttle to "Regular 3G" * from both a clean cache and a primed cache: * make sure that the total time to render the page is about on par with requireJS first change: load webpack chunks from CDN fixes: CNVS-32261 test plan: * run `npm run webpack-production` * check your page, it should load js files and chunks from the same hostname the page is served from. * now set a host: in config/canvas_cdn.yml (for testing locally, I just set it to http://127.0.0.1:3000, * restart rails and reload the page, now the scripts and chucks should come from that new hostname second change:include fingerprints in webpack bundle and chunk filenames closes: CNVS-28628 with this change we don't need to run `gulp rev` after running webpack and we can load both the bundle and chunk files safely from the cdn, since they will have content-based fingerprints so we can tell browsers to cache them forever. (we set those http caching headers in lib/canvas/cdn/s3_uploader.rb:53) test plan: * for both dev and production * run `npm run webpack` (or `npm run wepack-production`) * with a cdn configured in canvas_cdn.yml, run: RAILS_ENV=<dev or prod> bundle exec rake canvas:cdn:upload_to_s3 * check to make sure that the page loads the webpack js, that there are no errors, and it all came from the cdn third change: properly handle moment locale & timezone in webpack test plan: (see application_helper_spec.rb) * set a non-default user timezone, context timezone and locale * dates should show up in your timezone and and the date helper strings should be in your language better handling of moment custom locales closes: CNVS-33811 since we now have hatian and maori, we need to do this in a way that is not just a one-off for maori test plan: * set your locale to maori * in webpack & requireJS make sure dates show up right Change-Id: I34dbff7d46a1047f9b459d5e1c0d141f435d42fb Reviewed-on: https://gerrit.instructure.com/95737 Reviewed-by: Clay Diffrient <cdiffrient@instructure.com> Tested-by: Jenkins QA-Review: Benjamin Christian Nelson <bcnelson@instructure.com> Product-Review: Ryan Shaw <ryan@instructure.com>
2016-12-13 01:32:11 +08:00
// Some plugins use a special spec_canvas path for their specs
/\/spec\/javascripts\/jsx\//,
/\/ember\/.*\/tests\//
],
// Our spec files expect qunit's global `test`, `module`, `asyncTest` and `start` variables.
// These imports loaders make it so they are avalable as local variables
// inside of a closure, without truly making them globals.
// We should get rid of this and just change our actual source to s/test/qunit.test/ and s/module/qunit.module/
loaders: [
'imports-loader?test=>QUnit.test',
'imports-loader?asyncTest=>QUnit.asyncTest',
'imports-loader?start=>QUnit.start',
]
})
// For faster local debugging in karma, only add istambul cruft you've explicity set the "COVERAGE" environment variable
if (process.env.COVERAGE) {
testWebpackConfig.module.rules.unshift({
test: /(jsx.*(\.js$|\.jsx$)|\.coffee$|public\/javascripts\/.*\.js$)/,
exclude: /(node_modules|spec|public\/javascripts\/(bower|client_apps|translations|vendor|custom_moment_locales))/,
loader: 'istanbul-instrumenter-loader'
})
}
Webpack: better handling of chunks and cdn stuff fixes: CNVS-31779 [webpack] bundle file size test plan: * using webpack, look at the network panel in the chrome developer console. * the total ammount of javascript loaded for any given page should be much less than before this commit and about on par with what requireJS loads for the same page. * use chrome network panel to throttle to "Regular 3G" * from both a clean cache and a primed cache: * make sure that the total time to render the page is about on par with requireJS first change: load webpack chunks from CDN fixes: CNVS-32261 test plan: * run `npm run webpack-production` * check your page, it should load js files and chunks from the same hostname the page is served from. * now set a host: in config/canvas_cdn.yml (for testing locally, I just set it to http://127.0.0.1:3000, * restart rails and reload the page, now the scripts and chucks should come from that new hostname second change:include fingerprints in webpack bundle and chunk filenames closes: CNVS-28628 with this change we don't need to run `gulp rev` after running webpack and we can load both the bundle and chunk files safely from the cdn, since they will have content-based fingerprints so we can tell browsers to cache them forever. (we set those http caching headers in lib/canvas/cdn/s3_uploader.rb:53) test plan: * for both dev and production * run `npm run webpack` (or `npm run wepack-production`) * with a cdn configured in canvas_cdn.yml, run: RAILS_ENV=<dev or prod> bundle exec rake canvas:cdn:upload_to_s3 * check to make sure that the page loads the webpack js, that there are no errors, and it all came from the cdn third change: properly handle moment locale & timezone in webpack test plan: (see application_helper_spec.rb) * set a non-default user timezone, context timezone and locale * dates should show up in your timezone and and the date helper strings should be in your language better handling of moment custom locales closes: CNVS-33811 since we now have hatian and maori, we need to do this in a way that is not just a one-off for maori test plan: * set your locale to maori * in webpack & requireJS make sure dates show up right Change-Id: I34dbff7d46a1047f9b459d5e1c0d141f435d42fb Reviewed-on: https://gerrit.instructure.com/95737 Reviewed-by: Clay Diffrient <cdiffrient@instructure.com> Tested-by: Jenkins QA-Review: Benjamin Christian Nelson <bcnelson@instructure.com> Product-Review: Ryan Shaw <ryan@instructure.com>
2016-12-13 01:32:11 +08:00
module.exports = testWebpackConfig