x0 icon indicating copy to clipboard operation
x0 copied to clipboard

Fix: switch over to webpack-dev-server

Open airtonix opened this issue 5 years ago • 9 comments

Fixes #104

airtonix avatar Oct 16 '18 10:10 airtonix

Not sure how to deal with the failing test. It's choking on classnames.

airtonix avatar Oct 16 '18 11:10 airtonix

Thanks @airtonix! This is looking great so far. I'm going to take this for a spin shortly. Btw, to fix the snapshot failure you can regenerate the snapshot with npm t -- -u.

johno avatar Oct 17 '18 21:10 johno

Cool, I'll try tackle that tonight. 10.30 am right now

On Thu, Oct 18, 2018, 8:20 AM John Otander [email protected] wrote:

Thanks @airtonix https://github.com/airtonix! This is looking great so far. I'm going to take this for a spin shortly. Btw, to fix the snapshot failure you can regenerate the snapshot with npm t -- -u.

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHub https://github.com/c8r/x0/pull/105#issuecomment-430802281, or mute the thread https://github.com/notifications/unsubscribe-auth/AADvKQ4GaAemGzthi7gEccy9KWaWeOXiks5ul6Y_gaJpZM4XeFum .

airtonix avatar Oct 18 '18 00:10 airtonix

not sure why 5973ff1 failed. I updated the snapshots

airtonix avatar Oct 21 '18 09:10 airtonix

./stumped

zenobius@JADAKREN ~\Projects\Mine\x0 [feature/104-replace-webpack-serve-with-webpack-dev-server*]
$ npm run test:components

> @compositor/[email protected] test:components C:\Users\zenobius\Projects\Mine\x0
> nyc ava test/components.js

The above error occurred in the <Throws> component:
    in Throws
    in Catch

React will try to recreate this component tree from scratch using the error boundary you provided, Catch.
Warning: You cannot change <Router history>
Warning: You cannot change <Router history>
Warning: You cannot change <Router history>

  31 passed
  1 skipped
-------------------|----------|----------|----------|----------|-------------------|
File               |  % Stmts | % Branch |  % Funcs |  % Lines | Uncovered Line #s |
-------------------|----------|----------|----------|----------|-------------------|
All files          |    89.62 |    58.46 |    75.61 |    93.06 |                   |
 Catch.js          |    66.67 |       50 |      100 |    71.43 |             13,14 |
 CenteredLayout.js |      100 |      100 |      100 |      100 |                   |
 FileList.js       |      100 |       50 |      100 |      100 |                 4 |
 Library.js        |      100 |       50 |      100 |      100 |                50 |
 LiveEditor.js     |    73.68 |        0 |        0 |     87.5 |             50,58 |
 LivePreview.js    |      100 |      100 |      100 |      100 |                   |
 ScopeProvider.js  |      100 |      100 |      100 |      100 |                   |
 ScrollTop.js      |    92.31 |       75 |      100 |      100 |              4,14 |
 SidebarLayout.js  |    88.73 |    59.38 |    70.83 |    91.49 |   230,251,285,288 |
 scope.js          |     93.1 |    77.78 |      100 |       92 |             53,55 |
-------------------|----------|----------|----------|----------|-------------------|
zenobius@JADAKREN ~\Projects\Mine\x0 [feature/104-replace-webpack-serve-with-webpack-dev-server*]
$ npm test

> @compositor/[email protected] test C:\Users\zenobius\Projects\Mine\x0
> nyc ava --timeout=60s

The above error occurred in the <Throws> component:
    in Throws
    in Catch

React will try to recreate this component tree from scratch using the error boundary you provided, Catch.
Warning: You cannot change <Router history>
Warning: You cannot change <Router history>
Warning: You cannot change <Router history>
[BABEL] Note: The code generator has deoptimised the styling of "C:/Users/zenobius/Projects/Mine/x0/test/output/TEMP/App.js" as it exceeds the max of "500KB".

  35 passed
  1 skipped
--------------------|----------|----------|----------|----------|-------------------|
File                |  % Stmts | % Branch |  % Funcs |  % Lines | Uncovered Line #s |
--------------------|----------|----------|----------|----------|-------------------|
All files           |    83.08 |    55.56 |    81.08 |    84.59 |                   |
 lib                |    74.65 |    53.16 |    87.88 |    74.59 |                   |
  build.js          |    69.49 |    43.55 |       84 |     69.9 |... 18,219,222,223 |
  config.js         |      100 |      100 |      100 |      100 |                   |
  createTemplate.js |      100 |      100 |      100 |      100 |                   |
  mdx-fm-loader.js  |      100 |    66.67 |      100 |      100 |                 5 |
  template.js       |      100 |    91.67 |      100 |      100 |                 2 |
 src                |    89.62 |    58.46 |    75.61 |    93.06 |                   |
  Catch.js          |    66.67 |       50 |      100 |    71.43 |             13,14 |
  CenteredLayout.js |      100 |      100 |      100 |      100 |                   |
  FileList.js       |      100 |       50 |      100 |      100 |                 4 |
  Library.js        |      100 |       50 |      100 |      100 |                50 |
  LiveEditor.js     |    73.68 |        0 |        0 |     87.5 |             50,58 |
  LivePreview.js    |      100 |      100 |      100 |      100 |                   |
  ScopeProvider.js  |      100 |      100 |      100 |      100 |                   |
  ScrollTop.js      |    92.31 |       75 |      100 |      100 |              4,14 |
  SidebarLayout.js  |    88.73 |    59.38 |    70.83 |    91.49 |   230,251,285,288 |
  scope.js          |     93.1 |    77.78 |      100 |       92 |             53,55 |
--------------------|----------|----------|----------|----------|-------------------|
zenobius@JADAKREN ~\Projects\Mine\x0 [feature/104-replace-webpack-serve-with-webpack-dev-server*]
$

airtonix avatar Oct 21 '18 09:10 airtonix

Ok this works on my personal website, you can try it out:

  • http://github.com/airtonix/zenobi.us/tree/feature/x0

uses docker, npm run dev, uses docker image airtonix/zenobi.us:4.0.0-beta

airtonix avatar Oct 23 '18 11:10 airtonix

So learnings here:

  • tests are sensitive to node 8 vs node 10
  • webpack-dev-server requires the plugins in e761671, no need to inject hot client as entry points like did back in webpack 2 days.
  • devServer: {hot: true } is a thing. it's required.

@johno ready for you guys to code review.

airtonix avatar Oct 23 '18 12:10 airtonix

Thanks for this @airtonix 🙏! I'll be reviewing and testing this PR sometime this week and will get a release cut.

johno avatar Nov 18 '18 17:11 johno

@airtonix i tested out your branch and i think you need to add the webpack-hot-client dependency

theRemix avatar Jan 22 '19 23:01 theRemix