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

custom rule - how? #772

Closed
Felicia5 opened this issue Feb 12, 2021 · 10 comments
Closed

custom rule - how? #772

Felicia5 opened this issue Feb 12, 2021 · 10 comments

Comments

@Felicia5
Copy link

Felicia5 commented Feb 12, 2021

Hi,
I am trying to add a custom rule using the logic of heading-has-content rule. But instead of headings I am looking for div elements. Also, in the util hasAccessibleChild I am not only looking for any text but a text that is equal to "apply".

#My questions:

  1. I don't know how to handle these errors. Can you suggest some solutions?
    I generated the rule files using the create-rule.md file. I added my changes to the rule and rule-test files. I run npm test and receive these errors:

    image

Do you have a further guide on these below?

2. How do I test if the rule and the rule-test works as I want it to? 
  I have read the [eslint documentation](https://eslint.org/docs/developer-guide/unit-tests) but I couldn't find a solution. 
  1. Without merging my rule to the master branch, how do I add my custom jsx-eslint /eslint-plugin-jsx-a11y plugin to test my code against the my new custom rule when I develop a new website?

here is my custom rule:
https://github.com/Felicia5/eslint-plugin-jsx-a11y/blob/first-rule-button/src/rules/first-rule-button.js

@ljharb
Copy link
Member

ljharb commented Feb 15, 2021

Hmm - I haven't actually used that script; it was last touched 4 years ago. It's highly likely that it's out of date.

The error looks like it's coming from flow itself - what code are you running it on?

@Felicia5
Copy link
Author

I got this error right after I :

  1. run npm run create -- myrule --author="Felicia Kovacs" --description="Enforce use of button elements to display apply text" - this is the command defined in the : https://github.com/jsx-eslint/eslint-plugin-jsx-a11y/blob/master/scripts/create-rule.md
  2. added code to files: rule, rule-test and hasAccessibleChildApply.js util
  3. run npm test within int-plugin-jsx-a11y folder I forked and cloned on my local desktop.

Any idea how I can get rid of the error message coming from flow?

@ljharb
Copy link
Member

ljharb commented Feb 17, 2021

Can you make a branch on your fork, and post the link here? I'll clone it locally and try it out.

@Felicia5
Copy link
Author

@Felicia5
Copy link
Author

Felicia5 commented Feb 17, 2021

These are the steps I have done after forking:

used git clone https://github.com/Felicia5/eslint-plugin-jsx-a11y.git
cd eslint-plugin-jsx-a11y
git remote add upstream https://github.com/jsx-eslint/eslint-plugin-jsx-a11y.git
git checkout -b "felicia-rule"
git commit -m "cloned repo locally"
git push
git push --set-upstream origin felicia-rule
npm install
npm run create -- myrule --author="Felicia Kovacs" --description="Enforce use of button elements to display apply text"

npm test
image

git add .
git commit -m "generated rule files"
git push

image

I added my changes

npm test
image

image

git add .
git commit -m "added my changes to rule, rule-test and hasAccessibleChildMyrule util file."
git push
image

npm version: 6.14.8

@V2dha
Copy link
Contributor

V2dha commented Jun 15, 2022

Can I look into this?

@ljharb
Copy link
Member

ljharb commented Jun 15, 2022

Go for it!

@V2dha
Copy link
Contributor

V2dha commented Jun 20, 2022

The flowconfig error i.e. if [ ! -e ./.flowconfig ]; then echo \"Could not find .flowconfig\"; else flow; test $? -eq 0 -o $? -eq 2; fi is mentioned in the Issue 855 and has been fixed in this latest commit. So upon replicating the new rule onto the latest commits, I am no longer getting the above errors.
But I am encountering the following errors which are related to import declarations in module.

 10:1   error  Cannot use import declarations in modules that export 
using CommonJS (module.exports = 'foo' or exports.bar = 'hi')  import/no-import-module-exports
  11:1   error  Cannot use import declarations in modules that export 
using CommonJS (module.exports = 'foo' or exports.bar = 'hi')  import/no-import-module-exports
  12:1   error  Cannot use import declarations in modules that export 
using CommonJS (module.exports = 'foo' or exports.bar = 'hi')  import/no-import-module-exports
  12:32  error  Unable to resolve path to module '../util/hasAccessibleChildMyrule'                                                  import/no-unresolved
  12:32  error  Missing file extension for "../util/hasAccessibleChildMyrule"                                                        import/extensions
  13:1   error  Cannot use import declarations in modules that export using CommonJS (module.exports = 'foo' or exports.bar = 'hi')  import/no-import-module-exports

✖ 6 problems (6 errors, 0 warnings)

@V2dha
Copy link
Contributor

V2dha commented Jun 23, 2022

Cannot use import declarations in modules that export using CommonJS (module.exports = 'foo' or exports.bar = 'hi') import/no-import-module-exports errors were due to the module.exports instead of export default that was mentioned in the boilerplate which is not updated yet.

@ljharb
Copy link
Member

ljharb commented Nov 3, 2023

I'm going to close this; please file a new issue if anyone's still having trouble.

@ljharb ljharb closed this as completed Nov 3, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants