@hubspot/eslint-config-ui-extensions 0.12.0 → 1.1.0

package/dist/__tests__/rules/no-console.spec.js

@@ -0,0 +1,262 @@
+import { RuleTester } from 'eslint';
+import tseslint from 'typescript-eslint';
+import { noConsole } from "../../rules/no-console.js";
+import { languageOptions } from "../../runtime.js";
+const ruleTester = new RuleTester({
+    languageOptions: {
+        ...languageOptions,
+        parserOptions: {
+            ecmaVersion: 'latest',
+            sourceType: 'module',
+            ecmaFeatures: {
+                jsx: true,
+            },
+        },
+    },
+});
+// Separate tester for TypeScript code
+const tsRuleTester = new RuleTester({
+    languageOptions: {
+        ...languageOptions,
+        parser: tseslint.parser,
+        parserOptions: {
+            ecmaVersion: 'latest',
+            sourceType: 'module',
+        },
+    },
+});
+describe('no-console', () => {
+    // Main test suite with JavaScript code
+    ruleTester.run('no-console', noConsole, {
+        valid: [
+            {
+                name: 'allows console methods on other objects',
+                code: `
+          const myConsole = { log: () => {}, error: () => {} };
+          myConsole.log('msg');
+          myConsole.error('error');
+        `,
+            },
+            {
+                name: 'allows locally shadowed console object',
+                code: `
+          const console = { log: () => {}, error: () => {} };
+          console.log('test');
+          console.error('error');
+        `,
+            },
+            {
+                name: 'allows SDK logger methods (recommended alternative)',
+                code: `
+          logger.debug('debug message');
+          logger.info('info message');
+          logger.warn('warning message');
+          logger.error('error message');
+        `,
+            },
+        ],
+        invalid: [
+            {
+                name: 'reports errors for global console.log',
+                code: `console.log('debug message');`,
+                errors: [{ messageId: 'noConsole' }],
+            },
+            {
+                name: 'reports errors for global console.info',
+                code: `console.info('info message');`,
+                errors: [{ messageId: 'noConsole' }],
+            },
+            {
+                name: 'reports errors for global console.warn',
+                code: `console.warn('warning message');`,
+                errors: [{ messageId: 'noConsole' }],
+            },
+            {
+                name: 'reports errors for global console.debug',
+                code: `console.debug('debug message');`,
+                errors: [{ messageId: 'noConsole' }],
+            },
+            {
+                name: 'reports errors for global console.error',
+                code: `console.error('error message');`,
+                errors: [{ messageId: 'noConsole' }],
+            },
+            {
+                name: 'reports errors for all console methods in one file',
+                code: `
+          console.log('log');
+          console.info('info');
+          console.warn('warn');
+          console.debug('debug');
+          console.error('error');
+        `,
+                errors: [
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                ],
+            },
+            {
+                name: 'reports errors for window.console calls',
+                code: `
+          window.console.log('log');
+          window.console.info('info');
+          window.console.warn('warn');
+          window.console.debug('debug');
+          window.console.error('error');
+        `,
+                errors: [
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                ],
+            },
+            {
+                name: 'reports errors for globalThis.console calls',
+                code: `
+          globalThis.console.log('log');
+          globalThis.console.info('info');
+          globalThis.console.warn('warn');
+          globalThis.console.debug('debug');
+          globalThis.console.error('error');
+        `,
+                errors: [
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                ],
+            },
+            {
+                name: 'reports errors for self.console calls',
+                code: `
+          self.console.log('log');
+          self.console.info('info');
+          self.console.warn('warn');
+          self.console.debug('debug');
+          self.console.error('error');
+        `,
+                errors: [
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                ],
+            },
+            {
+                name: 'reports errors for bracket notation console calls',
+                code: `
+          console['log']('log');
+          console['info']('info');
+          window.console['warn']('warn');
+          globalThis.console['debug']('debug');
+          self.console['error']('error');
+        `,
+                errors: [
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                ],
+            },
+            {
+                name: 'reports error in React component with JSX',
+                code: `
+          import { Text } from '@hubspot/ui-extensions';
+          function Component() {
+            console.log('Debug info');
+            console.error('Error occurred');
+            return <Text>Hello</Text>;
+          }
+        `,
+                errors: [{ messageId: 'noConsole' }, { messageId: 'noConsole' }],
+            },
+            {
+                name: 'reports error in async, arrow, and class method contexts',
+                code: `
+          async function test1() { console.log('async'); }
+          const test2 = () => console.warn('arrow');
+          class Test { method() { console.error('class'); } }
+        `,
+                errors: [
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                ],
+            },
+            {
+                name: 'reports error in try/catch and nested scopes',
+                code: `
+          try { console.error('error'); } catch (e) { console.warn('caught'); }
+          function outer() { function inner() { console.debug('nested'); } }
+        `,
+                errors: [
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                    { messageId: 'noConsole' },
+                ],
+            },
+        ],
+    });
+    // TypeScript-specific tests (requires TypeScript parser)
+    tsRuleTester.run('no-console (TypeScript)', noConsole, {
+        valid: [
+            {
+                name: 'allows console types in type alias',
+                code: `
+          type LogType = typeof console.log;
+          type InfoType = typeof console.info;
+          type WarnType = typeof console.warn;
+          type DebugType = typeof console.debug;
+          type ErrorType = typeof console.error;
+        `,
+            },
+            {
+                name: 'allows console types in interface property',
+                code: `
+          interface Logger {
+            log: typeof console.log;
+            info: typeof console.info;
+            warn: typeof console.warn;
+            debug: typeof console.debug;
+            error: typeof console.error;
+          }
+        `,
+            },
+            {
+                name: 'allows console types in function return type',
+                code: `
+          function getLogFn(): typeof console.log {
+            return logger.debug;
+          }
+
+          function getErrorFn(): typeof console.error {
+            return logger.error;
+          }
+        `,
+            },
+        ],
+        invalid: [
+            {
+                name: 'reports error for console calls even after type declarations',
+                code: `
+          type LogType = typeof console.log;
+          type ErrorType = typeof console.error;
+
+          function getData() {
+            console.log('Logging');
+            console.error('Error');
+          }
+        `,
+                errors: [{ messageId: 'noConsole' }, { messageId: 'noConsole' }],
+            },
+        ],
+    });
+});

package/dist/__tests__/rules/no-dom-access.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/__tests__/rules/no-dom-access.spec.js

@@ -0,0 +1,288 @@
+import { RuleTester } from 'eslint';
+import tseslint from 'typescript-eslint';
+import { noDomAccess } from "../../rules/no-dom-access.js";
+import { languageOptions } from "../../runtime.js";
+const ruleTester = new RuleTester({
+    languageOptions: {
+        ...languageOptions,
+        parserOptions: {
+            ecmaVersion: 'latest',
+            sourceType: 'module',
+            ecmaFeatures: {
+                jsx: true,
+            },
+        },
+    },
+});
+// Separate tester for TypeScript code
+const tsRuleTester = new RuleTester({
+    languageOptions: {
+        ...languageOptions,
+        parser: tseslint.parser,
+        parserOptions: {
+            ecmaVersion: 'latest',
+            sourceType: 'module',
+        },
+    },
+});
+describe('no-dom-access', () => {
+    // Main test suite with JavaScript code
+    ruleTester.run('no-dom-access', noDomAccess, {
+        valid: [
+            {
+                name: 'allows document as a local variable',
+                code: `
+          const document = { body: null };
+          document.querySelector('.test');
+        `,
+            },
+            {
+                name: 'allows document as a function parameter',
+                code: `
+          function parse(document) {
+            return document.body;
+          }
+        `,
+            },
+            {
+                name: 'allows document as a destructured property',
+                code: `
+          const { document } = customParser;
+          document.parse();
+        `,
+            },
+            {
+                name: 'allows document property on other objects',
+                code: `
+          const parser = { document: {} };
+          parser.document.parse();
+        `,
+            },
+            {
+                name: 'allows string "document" in code',
+                code: `
+          const selector = 'document.body';
+          // Check document for changes
+        `,
+            },
+            {
+                name: 'allows UI Extensions components',
+                code: `
+          import { Text, Button } from '@hubspot/ui-extensions';
+          function Component() {
+            return <Text>Hello</Text>;
+          }
+        `,
+            },
+        ],
+        invalid: [
+            {
+                name: 'reports error for direct document identifier usage',
+                code: `
+          const element = document.querySelector('.test');
+        `,
+                errors: [
+                    {
+                        messageId: 'noDomAccess',
+                    },
+                ],
+            },
+            {
+                name: 'reports error for document method calls',
+                code: `
+          document.getElementById('test');
+          document.querySelector('.class');
+          document.querySelectorAll('div');
+          document.createElement('div');
+        `,
+                errors: [
+                    { messageId: 'noDomAccess' },
+                    { messageId: 'noDomAccess' },
+                    { messageId: 'noDomAccess' },
+                    { messageId: 'noDomAccess' },
+                ],
+            },
+            {
+                name: 'reports error for document property access',
+                code: `
+          const body = document.body;
+          const head = document.head;
+          const cookie = document.cookie;
+        `,
+                errors: [
+                    { messageId: 'noDomAccess' },
+                    { messageId: 'noDomAccess' },
+                    { messageId: 'noDomAccess' },
+                ],
+            },
+            {
+                name: 'reports error for document reference assignment',
+                code: `
+          const doc = document;
+          doc.querySelector('.test');
+        `,
+                errors: [
+                    {
+                        messageId: 'noDomAccess',
+                    },
+                ],
+            },
+            {
+                name: 'reports error for window.document access',
+                code: `
+          window.document.querySelector('.test');
+          window.document.body;
+          window['document'].getElementById('test');
+        `,
+                errors: [
+                    { messageId: 'noDomAccess' },
+                    { messageId: 'noDomAccess' },
+                    { messageId: 'noDomAccess' },
+                ],
+            },
+            {
+                name: 'reports error for globalThis.document access',
+                code: `
+          globalThis.document.querySelector('.test');
+          globalThis['document'].body;
+        `,
+                errors: [{ messageId: 'noDomAccess' }, { messageId: 'noDomAccess' }],
+            },
+            {
+                name: 'reports error for self.document access',
+                code: `
+          self.document.querySelector('.test');
+          self['document'].getElementById('test');
+        `,
+                errors: [{ messageId: 'noDomAccess' }, { messageId: 'noDomAccess' }],
+            },
+            {
+                name: 'reports error in React component with JSX',
+                code: `
+          import { Text } from '@hubspot/ui-extensions';
+          function Component() {
+            const element = document.querySelector('.test');
+            return <Text>Hello</Text>;
+          }
+        `,
+                errors: [{ messageId: 'noDomAccess' }],
+            },
+            {
+                name: 'reports error in async, arrow, and class method contexts',
+                code: `
+          async function test1() { document.querySelector('.test'); }
+          const test2 = () => document.body;
+          class Test { method() { return document.head; } }
+        `,
+                errors: [
+                    { messageId: 'noDomAccess' },
+                    { messageId: 'noDomAccess' },
+                    { messageId: 'noDomAccess' },
+                ],
+            },
+            {
+                name: 'reports error in try/catch and nested scopes',
+                code: `
+          try {
+            document.querySelector('.test');
+          } catch (e) {
+            console.log(e);
+          }
+          function outer() {
+            function inner() {
+              return document.body;
+            }
+          }
+        `,
+                errors: [{ messageId: 'noDomAccess' }, { messageId: 'noDomAccess' }],
+            },
+            {
+                name: 'reports error for chained property access',
+                code: `
+          const title = document.body.firstChild;
+        `,
+                errors: [
+                    {
+                        messageId: 'noDomAccess',
+                    },
+                ],
+            },
+            {
+                name: 'reports error for document in conditional',
+                code: `
+          if (document.body) {
+            console.log('body exists');
+          }
+        `,
+                errors: [
+                    {
+                        messageId: 'noDomAccess',
+                    },
+                ],
+            },
+        ],
+    });
+    // TypeScript-specific tests (requires TypeScript parser)
+    tsRuleTester.run('no-dom-access (TypeScript)', noDomAccess, {
+        valid: [
+            {
+                name: 'allows document type in type alias',
+                code: `
+          type DocumentType = typeof document;
+        `,
+            },
+            {
+                name: 'allows document type in interface property',
+                code: `
+          interface Parser {
+            doc: typeof document;
+          }
+        `,
+            },
+            {
+                name: 'allows document type in function return type',
+                code: `
+          function getDoc(): typeof document {
+            return {} as any;
+          }
+        `,
+            },
+            {
+                name: 'allows Document type references',
+                code: `
+          interface CustomElement extends Document {
+            customMethod(): void;
+          }
+        `,
+            },
+        ],
+        invalid: [
+            {
+                name: 'reports error for document usage even after type declarations',
+                code: `
+          type DocumentType = typeof document;
+
+          function getData() {
+            const element = document.querySelector('.test');
+          }
+        `,
+                errors: [
+                    {
+                        messageId: 'noDomAccess',
+                    },
+                ],
+            },
+            {
+                name: 'reports error for document in TypeScript with explicit types',
+                code: `
+          const element: HTMLElement | null = document.querySelector('.test');
+        `,
+                errors: [
+                    {
+                        messageId: 'noDomAccess',
+                    },
+                ],
+            },
+        ],
+    });
+});

package/dist/__tests__/rules/no-experimental-imports.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/__tests__/rules/no-experimental-imports.spec.js

@@ -0,0 +1,67 @@
+import { RuleTester } from 'eslint';
+import { noExperimentalImports } from "../../rules/no-experimental-imports.js";
+import { languageOptions } from "../../runtime.js";
+const ruleTesterOptions = {
+    languageOptions: {
+        ...languageOptions,
+        parserOptions: {
+            ecmaFeatures: {
+                jsx: true,
+            },
+        },
+    },
+};
+const experimentalImport = `
+  import { Grid } from '@hubspot/ui-extensions/experimental';
+`;
+const experimentalSubpathImport = `
+  import { getDistanceFromTshirtSize } from '@hubspot/ui-extensions/experimental/Layout/constants';
+`;
+const stableImport = `
+  import { Text, Button } from '@hubspot/ui-extensions';
+`;
+const otherPackageImport = `
+  import { useState } from 'react';
+`;
+describe('no-experimental-imports', () => {
+    const ruleTester = new RuleTester(ruleTesterOptions);
+    ruleTester.run('no-experimental-imports', noExperimentalImports, {
+        valid: [
+            {
+                name: 'stable @hubspot/ui-extensions import',
+                code: stableImport,
+                filename: '/path/to/project/src/app/cards/Component.tsx',
+            },
+            {
+                name: 'other package import',
+                code: otherPackageImport,
+                filename: '/path/to/project/src/app/cards/Component.tsx',
+            },
+            {
+                name: 'crm extension point import',
+                code: `import { useCrmProperties } from '@hubspot/ui-extensions/crm/hooks';`,
+                filename: '/path/to/project/src/app/cards/Component.tsx',
+            },
+        ],
+        invalid: [
+            {
+                name: 'import from experimental path',
+                code: experimentalImport,
+                filename: '/path/to/project/src/app/cards/Component.tsx',
+                errors: [{ messageId: 'noExperimentalImports' }],
+            },
+            {
+                name: 'import from experimental subpath',
+                code: experimentalSubpathImport,
+                filename: '/path/to/project/src/app/extensions/Component.tsx',
+                errors: [{ messageId: 'noExperimentalImports' }],
+            },
+            {
+                name: 'default import from experimental',
+                code: `import ExperimentalComponent from '@hubspot/ui-extensions/experimental';`,
+                filename: '/path/to/project/src/app/settings/Component.tsx',
+                errors: [{ messageId: 'noExperimentalImports' }],
+            },
+        ],
+    });
+});

package/dist/__tests__/rules/no-html-elements.spec.d.ts

@@ -0,0 +1 @@
+export {};