forbid-dom-props.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122
  1. /**
  2. * @fileoverview Forbid certain props on DOM Nodes
  3. * @author David Vázquez
  4. */
  5. 'use strict';
  6. const docsUrl = require('../util/docsUrl');
  7. const report = require('../util/report');
  8. // ------------------------------------------------------------------------------
  9. // Constants
  10. // ------------------------------------------------------------------------------
  11. const DEFAULTS = [];
  12. // ------------------------------------------------------------------------------
  13. // Rule Definition
  14. // ------------------------------------------------------------------------------
  15. /**
  16. * @param {Map<string, object>} forbidMap // { disallowList: null | string[], message: null | string }
  17. * @param {string} prop
  18. * @param {string} tagName
  19. * @returns {boolean}
  20. */
  21. function isForbidden(forbidMap, prop, tagName) {
  22. const options = forbidMap.get(prop);
  23. return options && (
  24. typeof tagName === 'undefined'
  25. || !options.disallowList
  26. || options.disallowList.indexOf(tagName) !== -1
  27. );
  28. }
  29. const messages = {
  30. propIsForbidden: 'Prop "{{prop}}" is forbidden on DOM Nodes',
  31. };
  32. /** @type {import('eslint').Rule.RuleModule} */
  33. module.exports = {
  34. meta: {
  35. docs: {
  36. description: 'Disallow certain props on DOM Nodes',
  37. category: 'Best Practices',
  38. recommended: false,
  39. url: docsUrl('forbid-dom-props'),
  40. },
  41. messages,
  42. schema: [{
  43. type: 'object',
  44. properties: {
  45. forbid: {
  46. type: 'array',
  47. items: {
  48. anyOf: [{
  49. type: 'string',
  50. }, {
  51. type: 'object',
  52. properties: {
  53. propName: {
  54. type: 'string',
  55. },
  56. disallowedFor: {
  57. type: 'array',
  58. uniqueItems: true,
  59. items: {
  60. type: 'string',
  61. },
  62. },
  63. message: {
  64. type: 'string',
  65. },
  66. },
  67. }],
  68. minLength: 1,
  69. },
  70. uniqueItems: true,
  71. },
  72. },
  73. additionalProperties: false,
  74. }],
  75. },
  76. create(context) {
  77. const configuration = context.options[0] || {};
  78. const forbid = new Map((configuration.forbid || DEFAULTS).map((value) => {
  79. const propName = typeof value === 'string' ? value : value.propName;
  80. return [propName, {
  81. disallowList: typeof value === 'string' ? null : (value.disallowedFor || null),
  82. message: typeof value === 'string' ? null : value.message,
  83. }];
  84. }));
  85. return {
  86. JSXAttribute(node) {
  87. const tag = node.parent.name.name;
  88. if (!(tag && typeof tag === 'string' && tag[0] !== tag[0].toUpperCase())) {
  89. // This is a Component, not a DOM node, so exit.
  90. return;
  91. }
  92. const prop = node.name.name;
  93. if (!isForbidden(forbid, prop, tag)) {
  94. return;
  95. }
  96. const customMessage = forbid.get(prop).message;
  97. report(context, customMessage || messages.propIsForbidden, !customMessage && 'propIsForbidden', {
  98. node,
  99. data: {
  100. prop,
  101. },
  102. });
  103. },
  104. };
  105. },
  106. };