Commit Graph

70 Commits

Author SHA1 Message Date
Anders Kaseorg b65d2e063d js: Reformat with Prettier.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2020-07-17 14:31:25 -07:00
Anders Kaseorg 8046b6477a js: Remove extra consecutive spaces.
Prettier would do this anyway, but it’s separated out for a more
reviewable diff.  Generated by ESLint.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2020-07-17 14:31:25 -07:00
Anders Kaseorg 883e2fd325 js: Remove inner spacing from object literals.
We’re configuring Prettier with bracketSpacing: false.  Generated by
ESLint.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2020-07-17 14:31:25 -07:00
Anders Kaseorg f3726db89a js: Normalize strings to double quotes.
Prettier would do this anyway, but it’s separated out for a more
reviewable diff.  Generated by ESLint.

Signed-off-by: Anders Kaseorg <anders@zulip.com>
2020-07-17 14:31:24 -07:00
Anders Kaseorg e950344078 tsconfig: Enable resolveJsonModule.
Signed-off-by: Anders Kaseorg <anders@zulip.com>
2020-05-26 23:33:40 -07:00
Tim Abbott d0ffba96d9 webpack: Use cacheLoader for handlebars files.
This seems to save about 1s for run-dev.py startup time.
2020-05-03 11:03:04 -07:00
Tim Abbott af5ba9bf36 webpack: Use cacheLoader for JS files.
This seems to save over 50% of the webpack startup time in run-dev.py.
2020-05-03 11:03:04 -07:00
Anders Kaseorg 99242138a7 static: Serve webpack bundles from the root domain.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2020-04-10 00:48:02 -07:00
Anders Kaseorg 68cfcd6446 CVE-2020-9444: Prevent reverse tabnabbing attacks.
While we could fix this issue by changing the markdown processor,
doing so is not a robust solution, because even a momentary bug in the
markdown processor could allow cached messages that do not follow our
security policy.

This change ensures that even if our markdown processor has bugs that
result in rendered content that does not properly follow our policy of
using rel="noopener noreferrer" on links, we'll still do something
reasonable.

Co-authored-by: Tim Abbott <tabbott@zulipchat.com>
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2020-04-01 14:01:45 -07:00
Anders Kaseorg 1cdab5ae61 emoji: Resolve emoji sprite sheets and stylesheets through Webpack.
This gives them cache-compatible URLs, and also avoids some extra
copies of the sprite sheet images.

Comments on the Octopus emoji added by tabbott.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2020-02-25 14:43:46 -08:00
Anders Kaseorg b474fa0e37 webpack: Generalize debug-require-webpack-plugin interface.
Now the caller simply imports the debug ‘require’ function as a
module, deciding for itself how to expose it and with what name (in
our case, we expose it as ‘require’ with expose-loader).  Also, remove
a stray console.log.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2020-02-25 14:01:06 -08:00
Anders Kaseorg 46e14d1c40 webpack: Expose a version of require() for use in the browser console.
This adds a global require() function that makes JS modules accessible
to the browser console without adding them to the global window
object:

» const typeahead = require("./static/shared/js/typeahead");
» typeahead.popular_emojis
Array(6) [ "1f44d", "1f389", "1f642", "2764", "1f6e0", "1f419" ]

The list of known modules is exposed via the keys of require.ids
object.

This will allow us to migrate more modules to ES6 without losing
access to this debugging functionality.

I’ll probably upload this plugin to NPM at some point, but I figured
I’ll let it bake in-tree first.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2020-02-24 23:18:05 -08:00
Anders Kaseorg d7d8632525 pygments_data: Replace JS module with JSON module.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2020-02-12 10:09:12 -08:00
Anders Kaseorg e257253e64 emoji_codes: Replace JS module with JSON module.
webpack optimizes JSON modules using JSON.parse("{…}"), which is
faster than the normal JavaScript parser.

Update the backend to use emoji_codes.json too instead of the three
separate JSON files.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2020-02-12 10:09:12 -08:00
Anders Kaseorg f9f104a4f8 js: Automatically convert var to let and const in more files.
This commit was automatically generated by `tools/lint --only=eslint
--fix`, after an `.eslintrc.json` change.

A half dozen files were removed from the changes by tabbott pending
further work to ensure we avoid breaking valuable PRs with merge
conflicts.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-11-20 14:10:47 -08:00
Anders Kaseorg 2c4101dbc5 dependencies: Upgrade simplebar from 4.2.3 to 5.0.7.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-11-13 12:46:29 -08:00
Anders Kaseorg fffef412bc dependencies: Upgrade to-markdown 3.1.1 to turndown 5.0.3.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-11-11 16:26:31 -08:00
Anders Kaseorg de4685441c typescript: Type webpack.config.ts correctly.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-11-04 18:12:11 -08:00
Anders Kaseorg 042c558bb3 eslint: Enable sort-imports rule.
I figure we should enable this before we have lots of imports.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-10-30 13:10:25 -07:00
Anders Kaseorg fda70a5458 templates: Use just one webpack entry point per page.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-10-28 15:53:15 -07:00
Anders Kaseorg f245fcf408 webpack: Enable code splitting and deduplication.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-10-28 15:53:15 -07:00
Anders Kaseorg d1a3bf424a requirements: Use webpack4 fork of django-webpack-loader.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-10-28 15:53:15 -07:00
Anders Kaseorg ee9a6071fd 5xx.html: Build with webpack.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-10-28 15:53:15 -07:00
Anders Kaseorg c3bf7c6889 webpack: Consolidate production and development plugin configuration.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-10-28 15:39:34 -07:00
Greg Price a63786ac0d shared: Set up a way to share some frontend code with the mobile app.
This adds the general machinery required, and sets it up for the file
`typing_status.js` as a first use case.

Co-authored-by: Anders Kaseorg <anders@zulipchat.com>
2019-10-17 16:48:23 -07:00
Anders Kaseorg 173c9cee42 frontend_tests: Switch from ts-node to Babel; add rewire-ts plugin.
This will let tests rewrite TypeScript/ES6 module bindings that would
otherwise be read-only.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-10-17 16:48:23 -07:00
Anders Kaseorg 177eb2e02e webpack: Move CSS minification to optimization stage.
Otherwise Bootstrap doesn’t get minified, and also the minification
state is incorrectly reflected in the webpack cache.

The Terser plugin is used by default; we need to include it explicitly
to avoid removing it.

Switch from cssnano to clean-css because it’s noticeably faster.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-09-02 21:58:13 -07:00
Anders Kaseorg d312d04510 styles: Replace Sass with PostCSS.
It’s about as fast as node-sass (faster, according to their
benchmarks) and more flexible.  Autoprefixer is neat: we can now go
delete all our -moz-, -webkit-, etc. lines and have them autogenerated
as necessary based on .browserslistrc.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-08-29 16:35:51 -07:00
Anders Kaseorg 37ece9b8e2 webpack: Replace node-sass with Dart Sass.
It doesn't require scripts to install, allowing us to migrate yarn to
the more secure --ignore-scripts option.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-08-26 14:35:26 -07:00
Anders Kaseorg 6bca996e2e webpack: Chill. Out. When watching for changes.
Polling for changes every 100 milliseconds was burning enough CPU to
set mid-2015 MacBooks on fire.  Use the default inotify watching,
except on filesystems where that’s known not to work (nfs, vboxsf), in
which case polling once per second is more than enough for even the
fastest typers.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-08-16 11:05:21 -07:00
Anders Kaseorg f54a63e2f9 webpack: Transpile JS code with Babel.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-22 17:55:32 -07:00
Anders Kaseorg ab89f40a66 generate-custom-icon-webfont: Replace with webpack webfonts-loader.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-18 12:00:00 -07:00
Anders Kaseorg 54304b4008 webpack: Remove partial from handlebars-loader knownHelpers.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-17 16:07:17 -07:00
Anders Kaseorg b1aa304c4a templates: Suppress Handlebars automatic partial indentation.
Fixes #12795.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-17 16:07:17 -07:00
Anders Kaseorg 3c3471b720 templates: Rename *.handlebars ↦ *.hbs and - ↦ _.
Tweaked by tabbott to avoid accidentally disabling the linter for
handlebars templates.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-12 21:11:03 -07:00
Anders Kaseorg 218c60ae86 third: Upgrade spectrum-colorpicker to 1.8.0 from NPM.
We had several patches to spectrum, but the only essential one 
(0ea770fc18) had already been fixed upstream,
and another was just handling jQuery deprecation warnings for not yet removed features.

See #12749 for details.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-10 10:07:34 -07:00
Anders Kaseorg 3ded6f53c3 storage: Transfer responsibility for hash-naming webpack files to webpack.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-03 14:16:17 -07:00
Anders Kaseorg 5f3d36ae87 tex: Bundle KaTeX CLI using Webpack.
We don’t need a hacked copy anymore.  We run the installed version out
of node_modules in development, and a Webpack-bundled version of that
in production.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-02 16:50:03 -07:00
Anders Kaseorg 9f074fc071 webpack: Fix production setting of publicPath.
This is needed by webpack asynchronous require.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-02 16:49:38 -07:00
Anders Kaseorg 1b94733953 webpack: Remove resolve.modules override.
The minimal syntactic sugar it might provide isn’t worth the
unexpected side effects (including side effects on third party
modules).

For now, we allow zrequire to emulate the previous syntax in the Node
test suite, even though stealing part of the NPM namespace is
confusing.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-02 16:38:26 -07:00
Thomas Ip 8c199fd44c webpack: Use handlebars-loader to handle frontend templates.
And remove the compile-handlebars-templates system.
2019-07-02 16:23:29 -07:00
Anders Kaseorg fc3305b623 webpack: Trim resolve.extensions.
We don’t have any .tsx files, and nobody expects to be able to omit
the extension when importing .json, .scss, or .css files.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-07-02 16:09:29 -07:00
Anders Kaseorg 23cd064c86 webpack: Elide node_modules when importing JS modules.
Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-06-26 16:49:32 -07:00
Thomas Ip 637b2b784a dependencies: Upgrade mini-css-extract-plugin to 0.6.0 and use HMR.
Given mini-css-extract-plugin can now do hot module replacement,
this commit also removed css-hot-loader. Not upgrading to 0.7.0
as that cause webpack to crash.
2019-06-24 17:58:51 -07:00
Priyank Patel 01f8c89294 webpack: Use cache-loader for various loaders.
Profiling shows that using cache-loader saves ~6-7 seconds of time take
by webpack-dev-server on subsequent runs. The overhaul this adds when
nothing is cached (when running first time) is around 1-2 seconds. We don't
use cache loader for ts-loader since webpack docs says it will slow it down
and file-loader since it just copies files over and caching it would just
was disk space.

This is the second merge of this commit.  It fixes the issue with the
previous one by placingn cache-loader after mini-css-loader because it
just extracts css and caching that will make file-loader not run which
in turn makes developement enviorment break.
2019-06-04 16:43:04 -07:00
Tim Abbott 5d0e144d62 Revert "webpack: Use cache-loader for various loaders."
This reverts commit eb53b5e8de.

This appeared to not have the right logic yet for handling branch
switches.

See https://chat.zulip.org/#narrow/stream/3-backend/topic/frontend.20hot.20reloading/near/749259 for details.
2019-06-03 22:11:47 -07:00
Priyank Patel eb53b5e8de webpack: Use cache-loader for various loaders.
Profiling shows that using cache-loader saves ~6-7 seconds of time take
by webpack-dev-server on subsequent runs. The overhaul this adds when
nothing is cached (when running first time) is around 1-2 seconds. We don't
use cache loader for ts-loader since webpack docs says it will slow it down
and file-loader since it just copies files over and caching it would just
was disk space.

Profiling data:

-------- Master ---------

~/zulip (master) $ tools/webpack --watch | ts -s '%.S' # master
03.995825 ℹ 「wds」: Project is running at http://127.0.0.1:9994/
03.996161 ℹ 「wds」: webpack output is served from /webpack/
03.996289 ℹ 「wds」: Content not from webpack is served from ...
19.284477 ℹ 「wdm」:
19.285371 ℹ 「wdm」: Compiled successfully.

-------- cache-loader ---------

~/zulip (cache-loader)$ tools/webpack --watch | ts -s '%.S'
04.107913 ℹ 「wds」: Project is running at http://127.0.0.1:9994/
04.108646 ℹ 「wds」: webpack output is served from /webpack/
04.109068 ℹ 「wds」: Content not from webpack is served from ...
12.633782 ℹ 「wdm」:
12.634083 ℹ 「wdm」: Compiled successfully.
2019-06-03 20:15:51 -07:00
Thomas Ip 537014ee47 dependencies: Upgrade typescript to 3.5.1. 2019-06-03 12:24:00 -07:00
Anders Kaseorg 141088586b Completely replace perfect-scrollbar with SimpleBar.
perfect-scrollbar replaces both the appearance and the behavior of the
scrollbar, and its emulated behavior will never feel native on most
platforms.  SimpleBar customizes the appearance while preserving the
native behavior.

Signed-off-by: Anders Kaseorg <andersk@mit.edu>
2019-05-17 12:06:51 -07:00
Anders Kaseorg dd3ccbc897 webpack: Fix node_modules path resolution.
Webpack applies special logic to relative paths provided in
`resolve.modules`, and this logic is expected to be used for
`node_modules`.  One case where this is important is when
`node_modules/foo` wants to import a different version of package
`bar` than the one at `node_modules/bar`, and so yarn gives it its own
copy at `node_modules/foo/node_modules/bar`.

It would probably be better to avoid screwing with `resolve.modules`
at all, but this at least brings us one step closer to the default of
just `["node_modules"]`.

Signed-off-by: Anders Kaseorg <anders@zulipchat.com>
2019-04-22 13:49:23 -07:00