feat(eslint-plugin-rules): add eslint-plugin-rules

Add eslint-plugin-rules to hold eslint custom rules for Foreman and plugins

.cz-config.js

@@ -45,6 +45,7 @@ const scopes = [
   'root',
   'builder',
   'eslint-plugin-foreman',
+  'eslint-plugin-rules',
   'stories',
   'test',
   'vendor',

.github/workflows/build-tarballs.yml

@@ -9,7 +9,7 @@ jobs:
     runs-on: 'ubuntu-latest'
     strategy:
       matrix:
-        package: ['builder', 'eslint-plugin-foreman', 'find-foreman', 'stories', 'test', 'vendor-core', 'vendor-dev', 'vendor']
+        package: ['builder', 'eslint-plugin-foreman', 'eslint-plugin-rules', 'find-foreman', 'stories', 'test', 'vendor-core', 'vendor-dev', 'vendor']
 
     steps:
     # only run if changes are detected in specified path

README.md

@@ -36,6 +36,7 @@ In your CSS code, the `@import` statements _do_ need to be explicit; see [this p
 - [@theforeman/builder](packages/builder) - Provides scripts (`npm run build`) to build production and development bundle files for Foreman core and plugins.
 - [@theforeman/test](packages/test) - Adds theforeman testing tools to you project, including jest, enzyme and other utils.
 - [@theforeman/eslint-plugin-foreman](packages/eslint-plugin-foreman) - Shared `eslint` configuration.  Opinionated styling for Foreman core and plugins.
+- [@theforeman/eslint-plugin-rules](packages/eslint-plugin-rules) - Shared `eslint` custom rules.  Opinionated styling for Foreman core and plugins.
 - [@theforeman/stories](packages/stories) - React Storybook for the Foreman project (JavaScript and React documentation for developers)
 - [@theforeman/find-foreman](packages/find-foreman) - Package to find full path of Foreman relative to Foreman plugin.
 

packages/eslint-plugin-rules/README.md

@@ -0,0 +1,74 @@
+# Eslint Plugin Rules
+
+## About
+
+Place for eslint custom rules for Foreman and plugins
+
+## Usage
+
+### Create an eslintrc file
+```js
+{
+  "plugins": ["@theforeman/rules"],
+  "rules": {
+    "@theforeman/rules/require-ouiaid": "warn",
+  }
+}
+```
+`ouiaId` prop is used in automation tests. An example can be found [here](https://github.com/SatelliteQE/airgun/blob/master/airgun/views/cloud_insights.py).
+
+If not specified in the eslintrc file, these components will be checked for an `ouiaId` prop:
+```
+  "Alert",
+  "Breadcrumb",
+  "Button",
+  "Card",
+  "Checkbox",
+  "Chip",
+  "ChipGroup",
+  "ContextSelector",
+  "Dropdown",
+  "DropdownItem",
+  "DropdownSeparator",
+  "DropdownToggle",
+  "DropdownToggleCheckbox",
+  "FormSelect",
+  "Menu",
+  "Modal",
+  "ModalBoxCloseButton",
+  "ModalContent",
+  "Nav",
+  "NavExpandable",
+  "NavItem",
+  "OptionsMenu",
+  "Pagination",
+  "Radio",
+  "RowWrapper",
+  "Select",
+  "Switch",
+  "TabButton",
+  "TabContent",
+  "Tabs",
+  "Text",
+  "TextInput",
+  "Title",
+  "Toolbar",
+  "Table",
+  "TableComposable",
+  "Tr"
+```
+
+You can specify what components you want to check against.
+```js
+{
+  "plugins": ["@theforeman/rules"],
+  "rules": {
+    "@theforeman/rules/require-ouiaid": [
+      "warn",
+      "Button",
+      "Table",
+    ]
+  }
+```
+
+Here is the list of [OUIA-compliant PatternFly 4 components](https://www.patternfly.org/v4/developer-resources/open-ui-automation/).

packages/eslint-plugin-rules/index.js

@@ -0,0 +1,7 @@
+const ouiaid = require('./lib/require-ouiaid');
+
+module.exports = {
+  rules: {
+    'require-ouiaid': ouiaid,
+  },
+};

packages/eslint-plugin-rules/lib/require-ouiaid.js

@@ -0,0 +1,60 @@
+const getProp = require('jsx-ast-utils/getProp');
+
+module.exports = {
+  create(context) {
+    const options = context.options.length
+      ? context.options
+      : [
+          'Alert',
+          'Breadcrumb',
+          'Button',
+          'Card',
+          'Checkbox',
+          'Chip',
+          'ChipGroup',
+          'ContextSelector',
+          'Dropdown',
+          'DropdownItem',
+          'DropdownSeparator',
+          'DropdownToggle',
+          'DropdownToggleCheckbox',
+          'FormSelect',
+          'Menu',
+          'Modal',
+          'ModalBoxCloseButton',
+          'ModalContent',
+          'Nav',
+          'NavExpandable',
+          'NavItem',
+          'OptionsMenu',
+          'Pagination',
+          'Radio',
+          'RowWrapper',
+          'Select',
+          'Switch',
+          'TabButton',
+          'TabContent',
+          'Tabs',
+          'Text',
+          'TextInput',
+          'Title',
+          'Toolbar',
+          'Table',
+          'TableComposable',
+          'Tr',
+        ];
+
+    return {
+      JSXElement(node) {
+        if (!options.includes(node.openingElement.name.name)) {
+          return;
+        }
+
+        const ouiaIdProp = getProp(node.openingElement.attributes, 'ouiaId');
+        if (!ouiaIdProp) {
+          context.report({ node, message: 'ouiaId property is missing' });
+        }
+      },
+    };
+  },
+};