eslint-plugin-smarthr - npm Package Compare versions

Comparing version 0.3.14 to 0.3.15

CHANGELOG.md

@@ -5,2 +5,9 @@ # Changelog
 
+### [0.3.15](https://github.com/kufu/eslint-plugin-smarthr/compare/v0.3.14...v0.3.15) (2023-11-29)
+
+
+### Features
+
+* a11y系ruleに "import時のasでのrename内容をチェックする" 処理を追加 ([#90](https://github.com/kufu/eslint-plugin-smarthr/issues/90)) ([2eab779](https://github.com/kufu/eslint-plugin-smarthr/commit/2eab77960985e7c52bd262ff674ae31cb2c6008e))
+
 ### [0.3.14](https://github.com/kufu/eslint-plugin-smarthr/compare/v0.3.13...v0.3.14) (2023-11-05)
@@ -7,0 +14,0 @@

libs/format_styled_components.js

@@ -6,2 +6,17 @@ const STYLED_COMPONENTS_METHOD = 'styled'
 
+const checkImportStyledComponents = (node, context) => {
+  if (node.source.value !== STYLED_COMPONENTS) {
+    return
+  }
+
+  const invalidNameNode = node.specifiers.find(findInvalidImportNameNode)
+
+  if (invalidNameNode) {
+    context.report({
+      node: invalidNameNode,
+      message: `${STYLED_COMPONENTS} をimportする際は、名称が"${STYLED_COMPONENTS_METHOD}" となるようにしてください。例: "import ${STYLED_COMPONENTS_METHOD} from '${STYLED_COMPONENTS}'"`,
+    });
+  }
+}
+
 const generateTagFormatter = ({ context, EXPECTED_NAMES, UNEXPECTED_NAMES }) => {
@@ -15,16 +30,23 @@ const entriesesTagNames = Object.entries(EXPECTED_NAMES).map(([b, e]) => [ new RegExp(b), new RegExp(e) ])
 
-  return {
-    ImportDeclaration: (node) => {
-      if (node.source.value !== STYLED_COMPONENTS) {
-        return
-      }
 
-      const invalidNameNode = node.specifiers.find(findInvalidImportNameNode)
-
-      if (invalidNameNode) {
+  const checkImportedNameToLocalName = (node, base, extended) => {
+    entriesesTagNames.forEach(([b, e]) => {
+      if (base.match(b) && !extended.match(e)) {
         context.report({
-          node: invalidNameNode,
-          message: `${STYLED_COMPONENTS} をimportする際は、名称が"${STYLED_COMPONENTS_METHOD}" となるようにしてください。例: "import ${STYLED_COMPONENTS_METHOD} from '${STYLED_COMPONENTS}'"`,
+          node,
+          message: `${extended}を正規表現 "${e.toString()}" がmatchする名称に変更してください`,
         });
       }
+    })
+  }
+
+  return {
+    ImportDeclaration: (node) => {
+      checkImportStyledComponents(node, context)
+
+      node.specifiers.forEach((s) => {
+        if (s.imported && s.imported.name !== s.local.name) {
+          checkImportedNameToLocalName(node, s.imported.name, s.local.name)
+        }
+      })
     },
@@ -69,10 +91,3 @@ VariableDeclarator: (node) => {
 
-        entriesesTagNames.forEach(([b, e]) => {
-          if (base.match(b) && !extended.match(e)) {
-            context.report({
-              node,
-              message: `${extended}を正規表現 "${e.toString()}" がmatchする名称に変更してください`,
-            });
-          }
-        })
+        checkImportedNameToLocalName(node, base, extended)
 
@@ -79,0 +94,0 @@ entriesesUnTagNames.forEach(([b, e, m]) => {

package.json

 {
   "name": "eslint-plugin-smarthr",
-  "version": "0.3.14",
+  "version": "0.3.15",
   "author": "SmartHR",
@@ -5,0 +5,0 @@ "license": "MIT",

test/a11y-anchor-has-href-attribute.js

@@ -28,2 +28,4 @@ const rule = require('../rules/a11y-anchor-has-href-attribute')
     { code: `import { css } from 'styled-components'` },
+    { code: `import { HogeAnchor as FugaAnchor } from './hoge'` },
+    { code: `import { Link as FugaLink } from './hoge'` },
     { code: 'const HogeAnchor = styled.a``' },
@@ -43,2 +45,4 @@ { code: 'const HogeLink = styled.a``' },
     { code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
+    { code: `import { Anchor as AnchorHoge } from './hoge'`, errors: [ { message: `AnchorHogeを正規表現 "/Anchor$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeLink as HogeLinkFuga } from './hoge'`, errors: [ { message: `HogeLinkFugaを正規表現 "/Link$/" がmatchする名称に変更してください` } ] },
     { code: 'const Hoge = styled.a``', errors: [ { message: `Hogeを正規表現 "/(Anchor|Link)$/" がmatchする名称に変更してください` } ] },
@@ -45,0 +49,0 @@ { code: 'const Hoge = styled(Anchor)``', errors: [ { message: `Hogeを正規表現 "/Anchor$/" がmatchする名称に変更してください` } ] },

test/a11y-clickable-element-has-text.js

@@ -25,2 +25,8 @@ const rule = require('../rules/a11y-clickable-element-has-text')
     { code: `import { css } from 'styled-components'` },
+    { code: `import { SmartHRLogo as HogeSmartHRLogo } from './hoge'` },
+    { code: `import { AbcButton as StyledAbcButton } from './hoge'` },
+    { code: `import { HogeAnchor as FugaAnchor } from './hoge'` },
+    { code: `import { Link as FugaLink } from './hoge'` },
+    { code: `import { FugaText as HogeFugaText } from './hoge'` },
+    { code: `import { FugaMessage as HogeFugaMessage } from './hoge'` },
     { code: 'const HogeAnchor = styled.a``' },
@@ -132,2 +138,8 @@ { code: 'const HogeLink = styled.a``' },
     { code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
+    { code: `import { SmartHRLogo as SmartHRLogoHoge } from './hoge'`, errors: [ { message: `SmartHRLogoHogeを正規表現 "/SmartHRLogo$/" がmatchする名称に変更してください` } ] },
+    { code: `import { AbcButton as AbcButtonFuga } from './hoge'`, errors: [ { message: `AbcButtonFugaを正規表現 "/Button$/" がmatchする名称に変更してください` } ] },
+    { code: `import { Anchor as AnchorHoge } from './hoge'`, errors: [ { message: `AnchorHogeを正規表現 "/Anchor$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeLink as HogeLinkFuga } from './hoge'`, errors: [ { message: `HogeLinkFugaを正規表現 "/Link$/" がmatchする名称に変更してください` } ] },
+    { code: `import { FugaText as FugaTextFuga } from './hoge'`, errors: [ { message: `FugaTextFugaを正規表現 "/Text$/" がmatchする名称に変更してください` } ] },
+    { code: `import { FugaMessage as FugaMessageFuga } from './hoge'`, errors: [ { message: `FugaMessageFugaを正規表現 "/Message$/" がmatchする名称に変更してください` } ] },
     { code: 'const Hoge = styled.a``', errors: [ { message: `Hogeを正規表現 "/(Anchor|Link)$/" がmatchする名称に変更してください` } ] },
@@ -134,0 +146,0 @@ { code: 'const Hoge = styled.button``', errors: [ { message: `Hogeを正規表現 "/Button$/" がmatchする名称に変更してください` } ]  },

test/a11y-heading-in-sectioning-content.js

@@ -29,2 +29,9 @@ const rule = require('../rules/a11y-heading-in-sectioning-content');
     { code: `import styled from 'styled-components'` },
+    { code: `import { PageHeading as HogePageHeading } from './hoge'` },
+    { code: `import { HogeHeading as FugaHeading } from './hoge'` },
+    { code: `import { HogeArticle as FugaArticle } from './hoge'` },
+    { code: `import { HogeAside as FugaAside } from './hoge'` },
+    { code: `import { HogeNav as FugaNav } from './hoge'` },
+    { code: `import { HogeSection as FugaSection } from './hoge'` },
+    { code: `import { ModelessDialog as FugaModelessDialog } from './hoge'` },
     { code: 'const HogePageHeading = styled.h1``' },
@@ -51,2 +58,9 @@ { code: 'const HogeHeading = styled.h2``' },
     { code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
+    { code: `import { HogePageHeading as PageHeadingAbc } from './hoge'`, errors: [ { message: `PageHeadingAbcを正規表現 "/PageHeading$/" がmatchする名称に変更してください` }, { message: `PageHeadingAbcを正規表現 "/Heading$/" がmatchする名称に変更してください` } ] },
+    { code: `import { Heading as HeadingHoge } from './hoge'`, errors: [ { message: `HeadingHogeを正規表現 "/Heading$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeArticle as HogeArticleFuga } from './hoge'`, errors: [ { message: `HogeArticleFugaを正規表現 "/Article$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeAside as HogeAsideFuga } from './hoge'`, errors: [ { message: `HogeAsideFugaを正規表現 "/Aside$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeNav as HogeNavFuga } from './hoge'`, errors: [ { message: `HogeNavFugaを正規表現 "/Nav$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeSection as HogeSectionFuga } from './hoge'`, errors: [ { message: `HogeSectionFugaを正規表現 "/Section$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeModelessDialog as HogeModelessDialogFuga } from './hoge'`, errors: [ { message: `HogeModelessDialogFugaを正規表現 "/ModelessDialog$/" がmatchする名称に変更してください` } ] },
     { code: 'const Hoge = styled.h1``', errors: [ { message: `Hogeを正規表現 "/PageHeading$/" がmatchする名称に変更してください` } ] },
@@ -53,0 +67,0 @@ { code: 'const Hoge = styled.h2``', errors: [ { message: `Hogeを正規表現 "/Heading$/" がmatchする名称に変更してください` } ] },

test/a11y-image-has-alt-attribute.js

@@ -29,2 +29,5 @@ const rule = require('../rules/a11y-image-has-alt-attribute')
     { code: `import { css } from 'styled-components'` },
+    { code: `import { HogeImg as FugaImg } from './hoge'` },
+    { code: `import { HogeImage as FugaImage } from './hoge'` },
+    { code: `import { HogeIcon as FugaIcon } from './hoge'` },
     { code: 'const HogeImg = styled.img``' },
@@ -50,2 +53,5 @@ { code: 'const HogeImage = styled.img``' },
     { code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
+    { code: `import { HogeImg as ImgFuga } from './hoge'`, errors: [ { message: `ImgFugaを正規表現 "/Img$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeImage as HogeImageFuga } from './hoge'`, errors: [ { message: `HogeImageFugaを正規表現 "/Image$/" がmatchする名称に変更してください` } ] },
+    { code: `import { Icon as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/Icon$/" がmatchする名称に変更してください` } ] },
     { code: 'const Hoge = styled.img``', errors: [ { message: `Hogeを正規表現 "/(Img|Image|Icon)$/" がmatchする名称に変更してください` } ] },
@@ -52,0 +58,0 @@ { code: 'const Hoge = styled.svg``', errors: [ { message: `Hogeを正規表現 "/(Img|Image|Icon)$/" がmatchする名称に変更してください` } ] },

test/a11y-input-has-name-attribute.js

@@ -26,2 +26,11 @@ const rule = require('../rules/a11y-input-has-name-attribute');
     { code: `import { css } from 'styled-components'` },
+    { code: `import { Input as HogeInput } from './hoge'` },
+    { code: `import { HogeTextarea as FugaTextarea } from './hoge'` },
+    { code: `import { Select as HogeSelect } from './hoge'` },
+    { code: `import { InputFile as HogeInputFile } from './hoge'` },
+    { code: `import { HogeRadioButton as FugaRadioButton } from './hoge'` },
+    { code: `import { CheckBox as FugaCheckBox } from './hoge'` },
+    { code: `import { HogeComboBox as FugaComboBox } from './hoge'` },
+    { code: `import { DatePicker as HogeDatePicker } from './hoge'` },
+    { code: `import { HogeDropZone as HogeFugaDropZone } from './hoge'` },
     { code: 'const HogeInput = styled.input``' },
@@ -47,2 +56,11 @@ { code: 'const HogeInput = styled(Input)``' },
     { code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
+    { code: `import { Input as InputHoge } from './hoge'`, errors: [ { message: `InputHogeを正規表現 "/Input$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeTextarea as HogeTextareaFuga } from './hoge'`, errors: [ { message: `HogeTextareaFugaを正規表現 "/Textarea$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeSelect as SelectFuga } from './hoge'`, errors: [ { message: `SelectFugaを正規表現 "/Select$/" がmatchする名称に変更してください` } ] },
+    { code: `import { InputFile as HogeInputFileFuga } from './hoge'`, errors: [ { message: `HogeInputFileFugaを正規表現 "/InputFile$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeRadioButton as FugaRadioButtonAbc } from './hoge'`, errors: [ { message: `FugaRadioButtonAbcを正規表現 "/RadioButton$/" がmatchする名称に変更してください` } ] },
+    { code: `import { CheckBox as FugaCheckBoxHoge } from './hoge'`, errors: [ { message: `FugaCheckBoxHogeを正規表現 "/CheckBox$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeComboBox as ComboBoxFuga } from './hoge'`, errors: [ { message: `ComboBoxFugaを正規表現 "/ComboBox$/" がmatchする名称に変更してください` } ] },
+    { code: `import { DatePicker as HogeDatePickerFuga } from './hoge'`, errors: [ { message: `HogeDatePickerFugaを正規表現 "/DatePicker$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeDropZone as HogeFugaDropZoneAbc } from './hoge'`, errors: [ { message: `HogeFugaDropZoneAbcを正規表現 "/DropZone$/" がmatchする名称に変更してください` } ] },
     { code: 'const Hoge = styled.input``', errors: [ { message: `Hogeを正規表現 "/Input$/" がmatchする名称に変更してください` } ] },
@@ -49,0 +67,0 @@ { code: 'const Hoge = styled.Input``', errors: [ { message: `Hogeを正規表現 "/Input$/" がmatchする名称に変更してください` } ] },

test/a11y-prohhibit-input-placeholder.js

@@ -20,2 +20,7 @@ const rule = require('../rules/a11y-prohibit-input-placeholder')
     { code: `import { css } from 'styled-components'` },
+    { code: `import { Input as HogeInput } from './hoge'` },
+    { code: `import { HogeSearchInput as FugaSearchInput } from './hoge'` },
+    { code: `import { HogeTextarea as FugaHogeTextarea } from './hoge'` },
+    { code: `import { ComboBox as FugaHogeComboBox } from './hoge'` },
+    { code: `import { AbcDatePicker as StyledDatePicker } from './hoge'` },
     { code: 'const HogeInput = styled.input``' },
@@ -48,2 +53,7 @@ { code: 'const HogeTextarea = styled.textarea``' },
     { code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
+    { code: `import { Input as InputHoge } from './hoge'`, errors: [ { message: `InputHogeを正規表現 "/Input$/" がmatchする名称に変更してください` } ] },
+    { code: `import { SearchInput as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/Input$/" がmatchする名称に変更してください` }, { message: `Hogeを正規表現 "/SearchInput$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeTextarea as HogeTextareaFuga } from './hoge'`, errors: [ { message: `HogeTextareaFugaを正規表現 "/Textarea$/" がmatchする名称に変更してください` } ] },
+    { code: `import { HogeComboBox as ComboBoxFuga } from './hoge'`, errors: [ { message: `ComboBoxFugaを正規表現 "/ComboBox$/" がmatchする名称に変更してください` } ] },
+    { code: `import { DatePicker as HogeDatePickerFuga } from './hoge'`, errors: [ { message: `HogeDatePickerFugaを正規表現 "/DatePicker$/" がmatchする名称に変更してください` } ] },
     { code: 'const Hoge = styled.input``', errors: [ { message: `Hogeを正規表現 "/Input$/" がmatchする名称に変更してください` } ] },
@@ -50,0 +60,0 @@ { code: 'const Hoge = styled(StyledInput)``', errors: [ { message: `Hogeを正規表現 "/Input$/" がmatchする名称に変更してください` } ] },

test/a11y-trigger-has-button.js

@@ -20,2 +20,8 @@ const rule = require('../rules/a11y-trigger-has-button')
     { code: `import { css } from 'styled-components'` },
+    { code: `import { DropdownTrigger as HogeDropdownTrigger } from './hoge'` },
+    { code: `import { FugaDialogTrigger as HogeDialogTrigger } from './hoge'` },
+    { code: `import { AbcButton as HogeAbcButton } from './hoge'` },
+    { code: `import { AnchorButton as FugaAnchorButton } from './hoge'` },
+    { code: `import { HogeAnchor as HogeFugaAnchor } from './hoge'` },
+    { code: `import { FugaLink as HogeLink } from './hoge'` },
     { code: 'const HogeButton = styled.button``' },
@@ -37,2 +43,8 @@ { code: 'const HogeAnchor = styled.a``' },
     { code: `import hoge from 'styled-components'`, errors: [ { message: `styled-components をimportする際は、名称が"styled" となるようにしてください。例: "import styled from 'styled-components'"` } ] },
+    { code: `import { DropdownTrigger as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/DropdownTrigger$/" がmatchする名称に変更してください` } ] },
+    { code: `import { DialogTrigger as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/DialogTrigger$/" がmatchする名称に変更してください` } ] },
+    { code: `import { Button as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/Button$/" がmatchする名称に変更してください` } ] },
+    { code: `import { AbcAnchorButton as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/Button$/" がmatchする名称に変更してください` }, { message: `Hogeを正規表現 "/AnchorButton$/" がmatchする名称に変更してください` } ] },
+    { code: `import { Anchor as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/Anchor$/" がmatchする名称に変更してください` } ] },
+    { code: `import { Link as Hoge } from './hoge'`, errors: [ { message: `Hogeを正規表現 "/Link$/" がmatchする名称に変更してください` } ] },
     { code: 'const Hoge = styled.button``', errors: [ { message: `Hogeを正規表現 "/Button$/" がmatchする名称に変更してください` } ] },
@@ -39,0 +51,0 @@ { code: 'const Hoge = styled.a``', errors: [ { message: `Hogeを正規表現 "/(Anchor|Link)$/" がmatchする名称に変更してください` } ] },

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

242643

increased by4.62%

Lines of code

4133

increased by2.18%

No dependency changes