valid-v-is.js 2.7 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. /**
  2. * @fileoverview enforce valid `v-is` directives
  3. * @author Yosuke Ota
  4. */
  5. 'use strict'
  6. // ------------------------------------------------------------------------------
  7. // Requirements
  8. // ------------------------------------------------------------------------------
  9. const utils = require('../utils')
  10. // ------------------------------------------------------------------------------
  11. // Helpers
  12. // ------------------------------------------------------------------------------
  13. /**
  14. * Check whether the given node is valid or not.
  15. * @param {VElement} node The element node to check.
  16. * @returns {boolean} `true` if the node is valid.
  17. */
  18. function isValidElement(node) {
  19. if (
  20. utils.isHtmlElementNode(node) &&
  21. !utils.isHtmlWellKnownElementName(node.rawName)
  22. ) {
  23. // Vue-component
  24. return false
  25. }
  26. return true
  27. }
  28. // ------------------------------------------------------------------------------
  29. // Rule Definition
  30. // ------------------------------------------------------------------------------
  31. module.exports = {
  32. meta: {
  33. type: 'problem',
  34. docs: {
  35. description: 'enforce valid `v-is` directives',
  36. categories: ['vue3-essential'],
  37. url: 'https://eslint.vuejs.org/rules/valid-v-is.html'
  38. },
  39. fixable: null,
  40. schema: [],
  41. messages: {
  42. unexpectedArgument: "'v-is' directives require no argument.",
  43. unexpectedModifier: "'v-is' directives require no modifier.",
  44. expectedValue: "'v-is' directives require that attribute value.",
  45. ownerMustBeHTMLElement:
  46. "'v-is' directive must be owned by a native HTML element, but '{{name}}' is not."
  47. }
  48. },
  49. /** @param {RuleContext} context */
  50. create(context) {
  51. return utils.defineTemplateBodyVisitor(context, {
  52. "VAttribute[directive=true][key.name.name='is']"(node) {
  53. if (node.key.argument) {
  54. context.report({
  55. node: node.key.argument,
  56. messageId: 'unexpectedArgument'
  57. })
  58. }
  59. if (node.key.modifiers.length > 0) {
  60. context.report({
  61. node,
  62. loc: {
  63. start: node.key.modifiers[0].loc.start,
  64. end: node.key.modifiers[node.key.modifiers.length - 1].loc.end
  65. },
  66. messageId: 'unexpectedModifier'
  67. })
  68. }
  69. if (!node.value || utils.isEmptyValueDirective(node, context)) {
  70. context.report({
  71. node,
  72. messageId: 'expectedValue'
  73. })
  74. }
  75. const element = node.parent.parent
  76. if (!isValidElement(element)) {
  77. const name = element.name
  78. context.report({
  79. node,
  80. messageId: 'ownerMustBeHTMLElement',
  81. data: { name }
  82. })
  83. }
  84. }
  85. })
  86. }
  87. }