Update dev tools

.circleci/config.yml

@@ -2,7 +2,7 @@ version: 2
 jobs:
   build:
     docker:
-      - image: circleci/node:16
+      - image: cimg/node:18.17.1
 
     steps:
       - checkout
@@ -18,4 +18,14 @@ jobs:
             - node_modules
           key: deps-{{ checksum "package.json" }}
 
-      - run: yarn test
+      - run: 
+          name: Tests
+          command: yarn test
+
+      - run:
+          name: Type checks
+          command: yarn tsc
+
+      - run:
+          name: ESLint
+          command: yarn lint

.eslintignore

@@ -1,6 +1,3 @@
 /lib
-/es
-/coverage
 /node_modules
 package.json
-package-lock.json

.eslintrc.js

@@ -1,17 +1,36 @@
+/**
+ * @type {import('@types/eslint').Linter.BaseConfig}
+ */
 module.exports = {
-  extends: ['kyt'],
-
+  extends: [
+    '@remix-run/eslint-config',
+    '@remix-run/eslint-config/node',
+    '@remix-run/eslint-config/jest-testing-library',
+    'prettier',
+  ],
+  plugins: ['prettier'],
   rules: {
-    'react/static-property-placement': 0,
-  },
-
-  overrides: [
-    {
-      files: ['*.test.js'],
-      rules: {
-        'react/jsx-props-no-spreading': 0,
-        'react/no-unknown-property': 0,
+    'import/order': [
+      'error',
+      {
+        'newlines-between': 'always',
+      },
+    ],
+    'prettier/prettier': [
+      'error',
+      {
+        singleQuote: true,
+        trailingComma: 'es5',
+        useTabs: false,
+        tabWidth: 2,
+        printWidth: 100,
       },
+    ],
+    'testing-library/render-result-naming-convention': 'off',
+  },
+  settings: {
+    jest: {
+      version: 27,
     },
-  ],
+  },
 };

.gitignore

@@ -1,3 +1,2 @@
-es
 lib
 node_modules

.npmignore

@@ -1,6 +1,6 @@
-.babelrc
-.eslintrc.json
+.eslintrc.js
 jest.setup.js
+*.config.js
 node_modules
 src
 __tests__

.nvmrc

@@ -1 +1 @@
-16.14.0
+18.17.1

.prettierrc

@@ -2,5 +2,7 @@
   "singleQuote": true,
   "trailingComma": "es5",
   "arrowParens": "avoid",
-  "printWidth": 100
+  "printWidth": 100,
+  "useTabs": false,
+  "tabWidth": 2
 }

.vscode/settings.json

@@ -6,6 +6,6 @@
     "typescriptreact"
   ],
   "editor.codeActionsOnSave": {
-    "source.fixAll.eslint": true,
-  },
-}
+    "source.fixAll.eslint": true
+  }
+}

__tests__/__snapshots__/misc.test.tsx.snap

@@ -0,0 +1,29 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`misc > API > encodes special characters 1`] = `"<meta name=\\"description\\" content=\\"This is &quot;quoted&quot; text and &amp; and '.\\" data-rh=\\"true\\">"`;
+
+exports[`misc > API > only adds new tags and preserves tags when rendering additional Helmet instances 1`] = `"<meta name=\\"description\\" content=\\"Test description\\" data-rh=\\"true\\">"`;
+
+exports[`misc > API > only adds new tags and preserves tags when rendering additional Helmet instances 2`] = `"<link href=\\"http://localhost/style.css\\" rel=\\"stylesheet\\" type=\\"text/css\\" data-rh=\\"true\\">"`;
+
+exports[`misc > API > only adds new tags and preserves tags when rendering additional Helmet instances 3`] = `"<meta name=\\"description\\" content=\\"New description\\" data-rh=\\"true\\">"`;
+
+exports[`misc > API > only adds new tags and preserves tags when rendering additional Helmet instances 4`] = `"<link href=\\"http://localhost/style2.css\\" rel=\\"stylesheet\\" type=\\"text/css\\" data-rh=\\"true\\">"`;
+
+exports[`misc > API > only adds new tags and preserves tags when rendering additional Helmet instances 5`] = `"<meta name=\\"description\\" content=\\"Test description\\" data-rh=\\"true\\">"`;
+
+exports[`misc > API > recognizes valid tags regardless of attribute ordering 1`] = `"<meta content=\\"Test Description\\" name=\\"description\\" data-rh=\\"true\\">"`;
+
+exports[`misc > Declarative API > encodes special characters 1`] = `"<meta name=\\"description\\" content=\\"This is &quot;quoted&quot; text and &amp; and '.\\" data-rh=\\"true\\">"`;
+
+exports[`misc > Declarative API > only adds new tags and preserves tags when rendering additional Helmet instances 1`] = `"<meta name=\\"description\\" content=\\"Test description\\" data-rh=\\"true\\">"`;
+
+exports[`misc > Declarative API > only adds new tags and preserves tags when rendering additional Helmet instances 2`] = `"<link href=\\"http://localhost/style.css\\" rel=\\"stylesheet\\" type=\\"text/css\\" data-rh=\\"true\\">"`;
+
+exports[`misc > Declarative API > only adds new tags and preserves tags when rendering additional Helmet instances 3`] = `"<meta name=\\"description\\" content=\\"New description\\" data-rh=\\"true\\">"`;
+
+exports[`misc > Declarative API > only adds new tags and preserves tags when rendering additional Helmet instances 4`] = `"<link href=\\"http://localhost/style2.css\\" rel=\\"stylesheet\\" type=\\"text/css\\" data-rh=\\"true\\">"`;
+
+exports[`misc > Declarative API > only adds new tags and preserves tags when rendering additional Helmet instances 5`] = `"<meta name=\\"description\\" content=\\"Test description\\" data-rh=\\"true\\">"`;
+
+exports[`misc > Declarative API > recognizes valid tags regardless of attribute ordering 1`] = `"<meta content=\\"Test Description\\" name=\\"description\\" data-rh=\\"true\\">"`;

__tests__/api/__snapshots__/base.test.tsx.snap

@@ -0,0 +1,5 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`base tag > API > sets base tag based on deepest nested component 1`] = `"<base href=\\"http://mysite.com/public\\" data-rh=\\"true\\">"`;
+
+exports[`base tag > Declarative API > sets base tag based on deepest nested component 1`] = `"<base href=\\"http://mysite.com/public\\" data-rh=\\"true\\">"`;

__tests__/api/__snapshots__/client.test.tsx.snap

@@ -0,0 +1,17 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`onChangeClientState > API > when handling client state change, calls the function with new state, addedTags and removedTags 1`] = `"<base href=\\"http://mysite.com/\\" data-rh=\\"true\\">"`;
+
+exports[`onChangeClientState > API > when handling client state change, calls the function with new state, addedTags and removedTags 2`] = `"<meta charset=\\"utf-8\\" data-rh=\\"true\\">"`;
+
+exports[`onChangeClientState > API > when handling client state change, calls the function with new state, addedTags and removedTags 3`] = `"<link href=\\"http://localhost/helmet\\" rel=\\"canonical\\" data-rh=\\"true\\">"`;
+
+exports[`onChangeClientState > API > when handling client state change, calls the function with new state, addedTags and removedTags 4`] = `"<script src=\\"http://localhost/test.js\\" type=\\"text/javascript\\" data-rh=\\"true\\"></script>"`;
+
+exports[`onChangeClientState > Declarative API > when handling client state change, calls the function with new state, addedTags and removedTags 1`] = `"<base href=\\"http://mysite.com/\\" data-rh=\\"true\\">"`;
+
+exports[`onChangeClientState > Declarative API > when handling client state change, calls the function with new state, addedTags and removedTags 2`] = `"<meta charset=\\"utf-8\\" data-rh=\\"true\\">"`;
+
+exports[`onChangeClientState > Declarative API > when handling client state change, calls the function with new state, addedTags and removedTags 3`] = `"<link href=\\"http://localhost/helmet\\" rel=\\"canonical\\" data-rh=\\"true\\">"`;
+
+exports[`onChangeClientState > Declarative API > when handling client state change, calls the function with new state, addedTags and removedTags 4`] = `"<script src=\\"http://localhost/test.js\\" type=\\"text/javascript\\" data-rh=\\"true\\"></script>"`;

__tests__/api/__snapshots__/link.test.tsx.snap

@@ -0,0 +1,49 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`link tags > API > allows duplicate link tags if specified in the same component 1`] = `"<link rel=\\"canonical\\" href=\\"http://localhost/helmet\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > API > allows duplicate link tags if specified in the same component 2`] = `"<link rel=\\"canonical\\" href=\\"http://localhost/helmet/component\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > API > does not render tag when primary attribute is null 1`] = `"<link rel=\\"canonical\\" href=\\"http://localhost/helmet/component\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > API > overrides duplicate link tags with a single link tag in a nested component 1`] = `"<link rel=\\"canonical\\" href=\\"http://localhost/helmet/innercomponent\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > API > overrides single link tag with duplicate link tags in a nested component 1`] = `"<link rel=\\"canonical\\" href=\\"http://localhost/helmet/component\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > API > overrides single link tag with duplicate link tags in a nested component 2`] = `"<link rel=\\"canonical\\" href=\\"http://localhost/helmet/innercomponent\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > API > sets link tags based on deepest nested component 1`] = `"<link href=\\"http://localhost/style.css\\" rel=\\"stylesheet\\" type=\\"text/css\\" media=\\"all\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > API > sets link tags based on deepest nested component 2`] = `"<link rel=\\"canonical\\" href=\\"http://localhost/helmet/innercomponent\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > API > sets link tags based on deepest nested component 3`] = `"<link href=\\"http://localhost/inner.css\\" rel=\\"stylesheet\\" type=\\"text/css\\" media=\\"all\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > API > tags 'rel' and 'href' properly use 'rel' as the primary identification for this tag, regardless of ordering 1`] = `"<link href=\\"http://localhost/helmet/newest\\" rel=\\"canonical\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > API > tags with rel='stylesheet' uses the href as the primary identification of the tag, regardless of ordering 1`] = `"<link href=\\"http://localhost/style.css\\" rel=\\"stylesheet\\" type=\\"text/css\\" media=\\"all\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > API > tags with rel='stylesheet' uses the href as the primary identification of the tag, regardless of ordering 2`] = `"<link rel=\\"stylesheet\\" href=\\"http://localhost/inner.css\\" type=\\"text/css\\" media=\\"all\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > Declarative API > allows duplicate link tags if specified in the same component 1`] = `"<link rel=\\"canonical\\" href=\\"http://localhost/helmet\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > Declarative API > allows duplicate link tags if specified in the same component 2`] = `"<link rel=\\"canonical\\" href=\\"http://localhost/helmet/component\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > Declarative API > does not render tag when primary attribute is null 1`] = `"<link rel=\\"canonical\\" href=\\"http://localhost/helmet/component\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > Declarative API > overrides duplicate link tags with a single link tag in a nested component 1`] = `"<link rel=\\"canonical\\" href=\\"http://localhost/helmet/innercomponent\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > Declarative API > overrides single link tag with duplicate link tags in a nested component 1`] = `"<link rel=\\"canonical\\" href=\\"http://localhost/helmet/component\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > Declarative API > overrides single link tag with duplicate link tags in a nested component 2`] = `"<link rel=\\"canonical\\" href=\\"http://localhost/helmet/innercomponent\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > Declarative API > sets link tags based on deepest nested component 1`] = `"<link href=\\"http://localhost/style.css\\" rel=\\"stylesheet\\" type=\\"text/css\\" media=\\"all\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > Declarative API > sets link tags based on deepest nested component 2`] = `"<link rel=\\"canonical\\" href=\\"http://localhost/helmet/innercomponent\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > Declarative API > sets link tags based on deepest nested component 3`] = `"<link href=\\"http://localhost/inner.css\\" rel=\\"stylesheet\\" type=\\"text/css\\" media=\\"all\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > Declarative API > tags 'rel' and 'href' properly use 'rel' as the primary identification for this tag, regardless of ordering 1`] = `"<link href=\\"http://localhost/helmet/newest\\" rel=\\"canonical\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > Declarative API > tags with rel='stylesheet' uses the href as the primary identification of the tag, regardless of ordering 1`] = `"<link href=\\"http://localhost/style.css\\" rel=\\"stylesheet\\" type=\\"text/css\\" media=\\"all\\" data-rh=\\"true\\">"`;
+
+exports[`link tags > Declarative API > tags with rel='stylesheet' uses the href as the primary identification of the tag, regardless of ordering 2`] = `"<link rel=\\"stylesheet\\" href=\\"http://localhost/inner.css\\" type=\\"text/css\\" media=\\"all\\" data-rh=\\"true\\">"`;