carteb / carte-blanche

An isolated development space with integrated fuzz testing for your components. See them individually, explore them in different states and quickly and confidently develop them.
https://www.youtube.com/watch?v=6g3-TQ6aaw8
MIT License
1.5k stars 47 forks source link

WIP: Windows support #376

Closed novascreen closed 8 years ago

novascreen commented 8 years ago

I thought I'd start looking into this a little bit and fixed some cross-env issues in npm scripts and also figured out why #290 happened. The backslashes in Windows get escaped away in webpack-plug/src/apply.js when building the script that's returned as a string. I'm now able to run npm run example:dev without errors and localhost:8080 loads, unfortunately at localhost:8080/carte-blanche i'm getting a 404 and am a little stuck as to why that might be. I see the basePath used in a few places and it should maybe always have a forward slash or at least sometimes (anything that's a URL obviously). Anyone have ideas as to the next steps? npm run example:dev:iron also didn't work for me, but maybe that's related. In any case i'd say that's a battle for another day.

mxstbr commented 8 years ago

Woah, awesome @novascreen, will take a look shortly!

nikgraf commented 8 years ago

@mxstbr do you have windows machine to test it?

mxstbr commented 8 years ago

@mxstbr do you have windows machine to test it?

Sadly I realized today that my old Windows machine doesn't boot anymore. :cry: This looks good code-wise though!

novascreen commented 8 years ago

could you use this? https://developer.microsoft.com/en-us/microsoft-edge/tools/vms/

ingro commented 8 years ago

@novascreen I'm very interested in this too, let me know if I can be of any help!

mxstbr commented 8 years ago

One small comment then we can merge this, cross-env is definitely the right way to go! Thanks!

ingro commented 8 years ago

@novascreen @mxstbr I've made some findings about the 404 problem.

It seems that the assets are emitted by carte-blanche using path.join to determine their destination path, which would be \path\to\file on windows instead of the expected path/to/file.

To fix this I tried to use path.posix in few points and this seems to fix the problem, now I can see carte-blanche's dashboard with a list of components on the left.

Anyway there are still 404, I guess that those come from the react-plugin instead, those calls fails: http://localhost:8082/variations/srccomponents/Header.js and thus I don't see my component rendered.

novascreen commented 8 years ago

That's great news @ingro i'll check this out tonight (i'm 6h behind you guys), could you share your work as a patch or a branch in your own fork?

@mxstbr i'll move that function into utils and write a test tonight.

When you're on Windows and get a path in Node e.g. with process.cwd() you'll get something like C:\\Repos\\react-boilerplate, but when you console.log that you actually get C:\Repos\react-boilerplate. So when you build that script as a string those backslashes just escape the next character (in the example R of Repos and r of react), and the end result is C:Reposreact-boilerplate. That's why I duplicated the backslashes.

ingro commented 8 years ago

I'm a little noob with github, I'll try with creating a new branch on a fork asap!

ingro commented 8 years ago

@novascreen that's the commit

mxstbr commented 8 years ago

Awesome, this is going to be good!

novascreen commented 8 years ago

great, thanks @ingro

ingro commented 8 years ago

I'm still a little puzzled on how the list of components is generated and handed to the client, maybe @mxstbr could give us some insights on that part? I feel that the remaing problems lies there.

novascreen commented 8 years ago

hey @ingro, i think i found all the places where we needed to enforce forward slashes

@mxstbr i also made sure that tests are passing on Windows. Let me know if you're ok with me adding that slash dependency and also changing some of your tests.

Is it normal that a variation takes 5+ seconds to load into the iframe?

That Travis CI build failure doesn't seem related to anything I did, does it?

ingro commented 8 years ago

Great work @novascreen , I'll check it out immediately!

ingro commented 8 years ago

I can confirm that now it works, although I too can report major slowness when creating and updating variations, but I don't know if they are related to windows.

nikgraf commented 8 years ago

I just fails due the flow linting which is fixed in this PR https://github.com/carteb/carte-blanche/pull/379

nikgraf commented 8 years ago

btw don't worry about it being slow on Windows. Running the development environment of carte blanche uses inline-source maps which leads to huge files that take a while to load

nikgraf commented 8 years ago

I had to fix a merge conflict and therefor opened another PR that I merged: https://github.com/carteb/carte-blanche/pull/381

Thx a lot @novascreen & @ingro - awesome work 👌