Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add ESLint rule playground #14609

Merged
merged 3 commits into from
Jan 16, 2019
Merged

Add ESLint rule playground #14609

merged 3 commits into from
Jan 16, 2019

Conversation

gaearon
Copy link
Collaborator

@gaearon gaearon commented Jan 16, 2019

I found it rather annoying to iterate on our lint rules. Www/Nuclide has been too slow, and tests, while nice, make it too cumbersome to experiment with one particular use case, or just explore how the rule "feels" in practice.

This adds a "playground" fixture that lets you edit a file in an editor like VSCode and have any changes to rule source be reflected immediately on recheck. I had to make a hacky "proxy" rule for that to work because Node would cache the actual rule normally. The resulting workflow is pretty nice and I want to check this in — it'll definitely be useful to me but maybe to someone else too.

Obligatory gif:

Demo

@bvaughn
Copy link
Contributor

bvaughn commented Jan 16, 2019

I don't think this seems to be working for me. Maybe I'm misunderstanding something?

I've ran yarn && yarn start:
screen shot 2019-01-16 at 3 39 42 pm

When I modify the RulesOfHooks file– this watch re-runs successfully.

But I've opened the fixtures/eslint/index.js file and tried editing it– and nothing happens. No warnings show.

I have VS Code with the ESLint extension installed:
screen shot 2019-01-16 at 3 40 42 pm

@gaearon
Copy link
Collaborator Author

gaearon commented Jan 16, 2019

Did you open react folder in VSCode or react/fixtures/eslint? It seems like it doesn't work unless you open this specific folder as project root. I'll add to README.

@bvaughn
Copy link
Contributor

bvaughn commented Jan 16, 2019

Ah, that would be it then. I assumed you could open the full react project (since you would also be editing the rule).

Copy link
Contributor

@bvaughn bvaughn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks like it works for me now 👍

@gaearon
Copy link
Collaborator Author

gaearon commented Jan 16, 2019

I don't like Code so I'll be editing it in Sublime personally. :-)

But I think you can React as a folder to workspace and then it works.

screen shot 2019-01-16 at 11 50 40 pm

@gaearon gaearon merged commit 8a12009 into facebook:master Jan 16, 2019
@gaearon gaearon deleted the eslint-fixture branch January 16, 2019 23:52
@bvaughn
Copy link
Contributor

bvaughn commented Jan 17, 2019

I don't like Code so I'll be editing it in Sublime personally. :-)

I'm also a Sublime user. I only fired up and tested Code because of your readme:

  1. "File > Add Folder to Workspace" this specific folder in VSCode with ESLint extension

@gaearon
Copy link
Collaborator Author

gaearon commented Jan 17, 2019

I figured most our users are on Code so we should probably test in that in general. Autofix support is nice too.

jetoneza pushed a commit to jetoneza/react that referenced this pull request Jan 23, 2019
* Add ESLint rule playground

* Update index.js

* Update index.js
n8schloss pushed a commit to n8schloss/react that referenced this pull request Jan 31, 2019
* Add ESLint rule playground

* Update index.js

* Update index.js
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants