From 82941c2ddee2da4b593ab4a851989140793cf063 Mon Sep 17 00:00:00 2001 From: Matt Seccafien <462077+cartogram@users.noreply.github.com> Date: Mon, 27 Feb 2023 17:39:50 +0100 Subject: [PATCH 1/3] Refactor SEO --- package-lock.json | 372 ++++++++++++------ packages/hydrogen/package.json | 4 +- packages/hydrogen/src/seo/seo.test.tsx | 153 +++++++ packages/hydrogen/src/seo/seo.ts | 13 +- packages/hydrogen/vitest.config.ts | 7 + .../($lang)/products/$productHandle.tsx | 39 +- 6 files changed, 447 insertions(+), 141 deletions(-) create mode 100644 packages/hydrogen/src/seo/seo.test.tsx create mode 100644 packages/hydrogen/vitest.config.ts diff --git a/package-lock.json b/package-lock.json index 960d03e6c9..69fa04a044 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,5 +1,5 @@ { - "name": "hydrogen", + "name": "h2", "lockfileVersion": 2, "requires": true, "packages": { @@ -5964,6 +5964,46 @@ "node": ">=12" } }, + "node_modules/@testing-library/react": { + "version": "14.0.0", + "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-14.0.0.tgz", + "integrity": "sha512-S04gSNJbYE30TlIMLTzv6QCTzt9AqIF5y6s6SzVFILNcNvbV/jU96GeiTPillGQo+Ny64M/5PV7klNYYgv5Dfg==", + "dependencies": { + "@babel/runtime": "^7.12.5", + "@testing-library/dom": "^9.0.0", + "@types/react-dom": "^18.0.0" + }, + "engines": { + "node": ">=14" + }, + "peerDependencies": { + "react": "^18.0.0", + "react-dom": "^18.0.0" + } + }, + "node_modules/@testing-library/react/node_modules/@testing-library/dom": { + "version": "9.0.0", + "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-9.0.0.tgz", + "integrity": "sha512-+/TLgKNFsYUshOY/zXsQOk+PlFQK+eyJ9T13IDVNJEi+M+Un7xlJK+FZKkbGSnf0+7E1G6PlDhkSYQ/GFiruBQ==", + "dependencies": { + "@babel/code-frame": "^7.10.4", + "@babel/runtime": "^7.12.5", + "@types/aria-query": "^5.0.1", + "aria-query": "^5.0.0", + "chalk": "^4.1.0", + "dom-accessibility-api": "^0.5.9", + "lz-string": "^1.4.4", + "pretty-format": "^27.0.2" + }, + "engines": { + "node": ">=14" + } + }, + "node_modules/@testing-library/react/node_modules/@types/aria-query": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.1.tgz", + "integrity": "sha512-XTIieEY+gvJ39ChLcB4If5zHtPxt3Syj5rgZR+e1ctpmK8NjPf0zFqsz4JpLJT0xla9GFDKjy8Cpu331nrmE1Q==" + }, "node_modules/@tootallnate/once": { "version": "1.1.2", "license": "MIT", @@ -6196,7 +6236,6 @@ }, "node_modules/@types/react-dom": { "version": "18.0.6", - "dev": true, "license": "MIT", "dependencies": { "@types/react": "*" @@ -7216,7 +7255,6 @@ }, "node_modules/aria-query": { "version": "5.1.1", - "dev": true, "license": "Apache-2.0", "dependencies": { "deep-equal": "^2.0.5" @@ -7420,7 +7458,6 @@ }, "node_modules/available-typed-arrays": { "version": "1.0.5", - "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -8961,6 +8998,12 @@ "url": "https://github.com/sponsors/fb55" } }, + "node_modules/css.escape": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/css.escape/-/css.escape-1.5.1.tgz", + "integrity": "sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==", + "dev": true + }, "node_modules/cssdb": { "version": "7.0.1", "dev": true, @@ -9204,7 +9247,6 @@ }, "node_modules/deep-equal": { "version": "2.0.5", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.0", @@ -9229,7 +9271,6 @@ }, "node_modules/deep-equal/node_modules/isarray": { "version": "2.0.5", - "dev": true, "license": "MIT" }, "node_modules/deep-extend": { @@ -9483,7 +9524,6 @@ }, "node_modules/dom-accessibility-api": { "version": "0.5.14", - "dev": true, "license": "MIT" }, "node_modules/dot-case": { @@ -9697,7 +9737,6 @@ }, "node_modules/es-abstract": { "version": "1.20.2", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -9733,7 +9772,6 @@ }, "node_modules/es-get-iterator": { "version": "1.1.2", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -9751,7 +9789,6 @@ }, "node_modules/es-get-iterator/node_modules/isarray": { "version": "2.0.5", - "dev": true, "license": "MIT" }, "node_modules/es-shim-unscopables": { @@ -9764,7 +9801,6 @@ }, "node_modules/es-to-primitive": { "version": "1.2.1", - "dev": true, "license": "MIT", "dependencies": { "is-callable": "^1.1.4", @@ -11383,7 +11419,6 @@ }, "node_modules/for-each": { "version": "0.3.3", - "dev": true, "license": "MIT", "dependencies": { "is-callable": "^1.1.3" @@ -11524,7 +11559,6 @@ }, "node_modules/function.prototype.name": { "version": "1.1.5", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -11541,7 +11575,6 @@ }, "node_modules/functions-have-names": { "version": "1.2.3", - "dev": true, "license": "MIT", "funding": { "url": "https://github.com/sponsors/ljharb" @@ -11689,7 +11722,6 @@ }, "node_modules/get-symbol-description": { "version": "1.0.0", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -11986,6 +12018,42 @@ "ufo": "^0.8.5" } }, + "node_modules/happy-dom": { + "version": "8.9.0", + "resolved": "https://registry.npmjs.org/happy-dom/-/happy-dom-8.9.0.tgz", + "integrity": "sha512-JZwJuGdR7ko8L61136YzmrLv7LgTh5b8XaEM3P709mLjyQuXJ3zHTDXvUtBBahRjGlcYW0zGjIiEWizoTUGKfA==", + "dev": true, + "dependencies": { + "css.escape": "^1.5.1", + "he": "^1.2.0", + "iconv-lite": "^0.6.3", + "node-fetch": "^2.x.x", + "webidl-conversions": "^7.0.0", + "whatwg-encoding": "^2.0.0", + "whatwg-mimetype": "^3.0.0" + } + }, + "node_modules/happy-dom/node_modules/iconv-lite": { + "version": "0.6.3", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz", + "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", + "dev": true, + "dependencies": { + "safer-buffer": ">= 2.1.2 < 3.0.0" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/happy-dom/node_modules/webidl-conversions": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz", + "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==", + "dev": true, + "engines": { + "node": ">=12" + } + }, "node_modules/hard-rejection": { "version": "2.1.0", "license": "MIT", @@ -12024,7 +12092,6 @@ }, "node_modules/has-bigints": { "version": "1.0.2", - "dev": true, "license": "MIT", "funding": { "url": "https://github.com/sponsors/ljharb" @@ -12059,7 +12126,6 @@ }, "node_modules/has-tostringtag": { "version": "1.0.0", - "dev": true, "license": "MIT", "dependencies": { "has-symbols": "^1.0.2" @@ -12124,6 +12190,15 @@ "url": "https://opencollective.com/unified" } }, + "node_modules/he": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz", + "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==", + "dev": true, + "bin": { + "he": "bin/he" + } + }, "node_modules/header-case": { "version": "2.0.4", "license": "MIT", @@ -12520,7 +12595,6 @@ }, "node_modules/internal-slot": { "version": "1.0.3", - "dev": true, "license": "MIT", "dependencies": { "get-intrinsic": "^1.1.0", @@ -12572,7 +12646,6 @@ }, "node_modules/is-arguments": { "version": "1.1.1", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -12591,7 +12664,6 @@ }, "node_modules/is-bigint": { "version": "1.0.4", - "dev": true, "license": "MIT", "dependencies": { "has-bigints": "^1.0.1" @@ -12612,7 +12684,6 @@ }, "node_modules/is-boolean-object": { "version": "1.1.2", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -12648,7 +12719,6 @@ }, "node_modules/is-callable": { "version": "1.2.6", - "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -12680,7 +12750,6 @@ }, "node_modules/is-date-object": { "version": "1.0.5", - "dev": true, "license": "MIT", "dependencies": { "has-tostringtag": "^1.0.0" @@ -12784,7 +12853,6 @@ }, "node_modules/is-map": { "version": "2.0.2", - "dev": true, "license": "MIT", "funding": { "url": "https://github.com/sponsors/ljharb" @@ -12792,7 +12860,6 @@ }, "node_modules/is-negative-zero": { "version": "2.0.2", - "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -12810,7 +12877,6 @@ }, "node_modules/is-number-object": { "version": "1.0.7", - "dev": true, "license": "MIT", "dependencies": { "has-tostringtag": "^1.0.0" @@ -12865,7 +12931,6 @@ }, "node_modules/is-regex": { "version": "1.1.4", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -12906,7 +12971,6 @@ }, "node_modules/is-set": { "version": "2.0.2", - "dev": true, "license": "MIT", "funding": { "url": "https://github.com/sponsors/ljharb" @@ -12914,7 +12978,6 @@ }, "node_modules/is-shared-array-buffer": { "version": "1.0.2", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2" @@ -12935,7 +12998,6 @@ }, "node_modules/is-string": { "version": "1.0.7", - "dev": true, "license": "MIT", "dependencies": { "has-tostringtag": "^1.0.0" @@ -12961,7 +13023,6 @@ }, "node_modules/is-symbol": { "version": "1.0.4", - "dev": true, "license": "MIT", "dependencies": { "has-symbols": "^1.0.2" @@ -12975,7 +13036,6 @@ }, "node_modules/is-typed-array": { "version": "1.1.9", - "dev": true, "license": "MIT", "dependencies": { "available-typed-arrays": "^1.0.5", @@ -13008,7 +13068,6 @@ }, "node_modules/is-weakmap": { "version": "2.0.1", - "dev": true, "license": "MIT", "funding": { "url": "https://github.com/sponsors/ljharb" @@ -13016,7 +13075,6 @@ }, "node_modules/is-weakref": { "version": "1.0.2", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2" @@ -13027,7 +13085,6 @@ }, "node_modules/is-weakset": { "version": "2.0.2", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -13857,7 +13914,6 @@ }, "node_modules/lz-string": { "version": "1.4.4", - "dev": true, "license": "WTFPL", "bin": { "lz-string": "bin/bin.js" @@ -15762,7 +15818,6 @@ }, "node_modules/object-is": { "version": "1.1.5", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -17621,7 +17676,6 @@ }, "node_modules/pretty-format": { "version": "27.5.1", - "dev": true, "license": "MIT", "dependencies": { "ansi-regex": "^5.0.1", @@ -17634,7 +17688,6 @@ }, "node_modules/pretty-format/node_modules/ansi-styles": { "version": "5.2.0", - "dev": true, "license": "MIT", "engines": { "node": ">=10" @@ -17945,7 +17998,6 @@ }, "node_modules/react-is": { "version": "17.0.2", - "dev": true, "license": "MIT" }, "node_modules/react-router": { @@ -18376,7 +18428,6 @@ }, "node_modules/regexp.prototype.flags": { "version": "1.4.3", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -19650,7 +19701,6 @@ }, "node_modules/string.prototype.trimend": { "version": "1.0.5", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -19663,7 +19713,6 @@ }, "node_modules/string.prototype.trimstart": { "version": "1.0.5", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -20884,7 +20933,6 @@ }, "node_modules/unbox-primitive": { "version": "1.0.2", - "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -21626,6 +21674,39 @@ "version": "3.0.1", "license": "BSD-2-Clause" }, + "node_modules/whatwg-encoding": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-2.0.0.tgz", + "integrity": "sha512-p41ogyeMUrw3jWclHWTQg1k05DSVXPLcVxRTYsXUk+ZooOCZLcoYgPZ/HL/D/N+uQPOtcp1me1WhBEaX02mhWg==", + "dev": true, + "dependencies": { + "iconv-lite": "0.6.3" + }, + "engines": { + "node": ">=12" + } + }, + "node_modules/whatwg-encoding/node_modules/iconv-lite": { + "version": "0.6.3", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz", + "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", + "dev": true, + "dependencies": { + "safer-buffer": ">= 2.1.2 < 3.0.0" + }, + "engines": { + "node": ">=0.10.0" + } + }, + "node_modules/whatwg-mimetype": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-3.0.0.tgz", + "integrity": "sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q==", + "dev": true, + "engines": { + "node": ">=12" + } + }, "node_modules/whatwg-url": { "version": "5.0.0", "license": "MIT", @@ -21649,7 +21730,6 @@ }, "node_modules/which-boxed-primitive": { "version": "1.0.2", - "dev": true, "license": "MIT", "dependencies": { "is-bigint": "^1.0.1", @@ -21664,7 +21744,6 @@ }, "node_modules/which-collection": { "version": "1.0.1", - "dev": true, "license": "MIT", "dependencies": { "is-map": "^2.0.1", @@ -21695,7 +21774,6 @@ }, "node_modules/which-typed-array": { "version": "1.1.8", - "dev": true, "license": "MIT", "dependencies": { "available-typed-arrays": "^1.0.5", @@ -22643,7 +22721,7 @@ }, "packages/cli": { "name": "@shopify/cli-hydrogen", - "version": "4.0.7", + "version": "4.0.8", "license": "SEE LICENSE IN LICENSE.md", "dependencies": { "@oclif/core": "^1.20.4", @@ -22726,7 +22804,7 @@ "version": "4.0.4", "license": "SEE LICENSE IN LICENSE.md", "dependencies": { - "@shopify/cli-hydrogen": "^4.0.6" + "@shopify/cli-hydrogen": "^4.0.8" }, "bin": { "create-hydrogen": "dist/create-app.js" @@ -22737,9 +22815,11 @@ "version": "2023.1.5", "license": "SEE LICENSE IN LICENSE.md", "dependencies": { - "@shopify/hydrogen-react": "2023.1.5" + "@shopify/hydrogen-react": "2023.1.5", + "@testing-library/react": "^14.0.0" }, "devDependencies": { + "happy-dom": "^8.9.0", "schema-dts": "^1.1.0", "vitest": "^0.27.2" }, @@ -22867,7 +22947,7 @@ "@headlessui/react": "^1.7.2", "@remix-run/react": "1.12.0", "@shopify/cli": "3.29.0", - "@shopify/cli-hydrogen": "^4.0.7", + "@shopify/cli-hydrogen": "^4.0.8", "@shopify/hydrogen": "^2023.1.5", "@shopify/remix-oxygen": "^1.0.3", "clsx": "^1.2.1", @@ -22917,7 +22997,7 @@ "dependencies": { "@remix-run/react": "1.12.0", "@shopify/cli": "3.29.0", - "@shopify/cli-hydrogen": "^4.0.7", + "@shopify/cli-hydrogen": "^4.0.8", "@shopify/hydrogen": "^2023.1.5", "@shopify/remix-oxygen": "^1.0.3", "graphql": "^16.6.0", @@ -22946,7 +23026,7 @@ "dependencies": { "@remix-run/react": "1.12.0", "@shopify/cli": "3.29.0", - "@shopify/cli-hydrogen": "^4.0.7", + "@shopify/cli-hydrogen": "^4.0.8", "@shopify/hydrogen": "^2023.1.5", "@shopify/remix-oxygen": "^1.0.3", "graphql": "^16.6.0", @@ -26534,7 +26614,7 @@ "@shopify/create-hydrogen": { "version": "file:packages/create-hydrogen", "requires": { - "@shopify/cli-hydrogen": "^4.0.6" + "@shopify/cli-hydrogen": "^4.0.8" } }, "@shopify/eslint-plugin": { @@ -26593,6 +26673,8 @@ "version": "file:packages/hydrogen", "requires": { "@shopify/hydrogen-react": "2023.1.5", + "@testing-library/react": "^14.0.0", + "happy-dom": "*", "schema-dts": "^1.1.0", "vitest": "^0.27.2" }, @@ -27035,6 +27117,38 @@ "pretty-format": "^27.0.2" } }, + "@testing-library/react": { + "version": "14.0.0", + "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-14.0.0.tgz", + "integrity": "sha512-S04gSNJbYE30TlIMLTzv6QCTzt9AqIF5y6s6SzVFILNcNvbV/jU96GeiTPillGQo+Ny64M/5PV7klNYYgv5Dfg==", + "requires": { + "@babel/runtime": "^7.12.5", + "@testing-library/dom": "^9.0.0", + "@types/react-dom": "^18.0.0" + }, + "dependencies": { + "@testing-library/dom": { + "version": "9.0.0", + "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-9.0.0.tgz", + "integrity": "sha512-+/TLgKNFsYUshOY/zXsQOk+PlFQK+eyJ9T13IDVNJEi+M+Un7xlJK+FZKkbGSnf0+7E1G6PlDhkSYQ/GFiruBQ==", + "requires": { + "@babel/code-frame": "^7.10.4", + "@babel/runtime": "^7.12.5", + "@types/aria-query": "^5.0.1", + "aria-query": "^5.0.0", + "chalk": "^4.1.0", + "dom-accessibility-api": "^0.5.9", + "lz-string": "^1.4.4", + "pretty-format": "^27.0.2" + } + }, + "@types/aria-query": { + "version": "5.0.1", + "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.1.tgz", + "integrity": "sha512-XTIieEY+gvJ39ChLcB4If5zHtPxt3Syj5rgZR+e1ctpmK8NjPf0zFqsz4JpLJT0xla9GFDKjy8Cpu331nrmE1Q==" + } + } + }, "@tootallnate/once": { "version": "1.1.2" }, @@ -27226,7 +27340,6 @@ }, "@types/react-dom": { "version": "18.0.6", - "dev": true, "requires": { "@types/react": "*" } @@ -27877,7 +27990,6 @@ }, "aria-query": { "version": "5.1.1", - "dev": true, "requires": { "deep-equal": "^2.0.5" } @@ -27991,8 +28103,7 @@ } }, "available-typed-arrays": { - "version": "1.0.5", - "dev": true + "version": "1.0.5" }, "aws-sdk": { "version": "2.1278.0", @@ -28931,6 +29042,12 @@ "css-what": { "version": "5.1.0" }, + "css.escape": { + "version": "1.5.1", + "resolved": "https://registry.npmjs.org/css.escape/-/css.escape-1.5.1.tgz", + "integrity": "sha512-YUifsXXuknHlUsmlgyY0PKzgPOr7/FjCePfHNt0jxm83wHZi44VDMQ7/fGNkjY3/jV1MC+1CmZbaHzugyeRtpg==", + "dev": true + }, "cssdb": { "version": "7.0.1", "dev": true @@ -29069,7 +29186,6 @@ }, "deep-equal": { "version": "2.0.5", - "dev": true, "requires": { "call-bind": "^1.0.0", "es-get-iterator": "^1.1.1", @@ -29089,8 +29205,7 @@ }, "dependencies": { "isarray": { - "version": "2.0.5", - "dev": true + "version": "2.0.5" } } }, @@ -29179,7 +29294,7 @@ "@remix-run/eslint-config": "1.12.0", "@remix-run/react": "1.12.0", "@shopify/cli": "3.29.0", - "@shopify/cli-hydrogen": "^4.0.7", + "@shopify/cli-hydrogen": "^4.0.8", "@shopify/eslint-plugin": "^42.0.1", "@shopify/hydrogen": "^2023.1.5", "@shopify/oxygen-workers-types": "^3.17.2", @@ -29286,8 +29401,7 @@ } }, "dom-accessibility-api": { - "version": "0.5.14", - "dev": true + "version": "0.5.14" }, "dot-case": { "version": "3.0.4", @@ -29437,7 +29551,6 @@ }, "es-abstract": { "version": "1.20.2", - "dev": true, "requires": { "call-bind": "^1.0.2", "es-to-primitive": "^1.2.1", @@ -29466,7 +29579,6 @@ }, "es-get-iterator": { "version": "1.1.2", - "dev": true, "requires": { "call-bind": "^1.0.2", "get-intrinsic": "^1.1.0", @@ -29479,8 +29591,7 @@ }, "dependencies": { "isarray": { - "version": "2.0.5", - "dev": true + "version": "2.0.5" } } }, @@ -29493,7 +29604,6 @@ }, "es-to-primitive": { "version": "1.2.1", - "dev": true, "requires": { "is-callable": "^1.1.4", "is-date-object": "^1.0.1", @@ -30523,7 +30633,6 @@ }, "for-each": { "version": "0.3.3", - "dev": true, "requires": { "is-callable": "^1.1.3" } @@ -30615,7 +30724,6 @@ }, "function.prototype.name": { "version": "1.1.5", - "dev": true, "requires": { "call-bind": "^1.0.2", "define-properties": "^1.1.3", @@ -30624,8 +30732,7 @@ } }, "functions-have-names": { - "version": "1.2.3", - "dev": true + "version": "1.2.3" }, "fuzzy": { "version": "0.1.3" @@ -30714,7 +30821,6 @@ }, "get-symbol-description": { "version": "1.0.0", - "dev": true, "requires": { "call-bind": "^1.0.2", "get-intrinsic": "^1.1.1" @@ -30905,6 +31011,38 @@ "ufo": "^0.8.5" } }, + "happy-dom": { + "version": "8.9.0", + "resolved": "https://registry.npmjs.org/happy-dom/-/happy-dom-8.9.0.tgz", + "integrity": "sha512-JZwJuGdR7ko8L61136YzmrLv7LgTh5b8XaEM3P709mLjyQuXJ3zHTDXvUtBBahRjGlcYW0zGjIiEWizoTUGKfA==", + "dev": true, + "requires": { + "css.escape": "^1.5.1", + "he": "^1.2.0", + "iconv-lite": "^0.6.3", + "node-fetch": "^2.x.x", + "webidl-conversions": "^7.0.0", + "whatwg-encoding": "^2.0.0", + "whatwg-mimetype": "^3.0.0" + }, + "dependencies": { + "iconv-lite": { + "version": "0.6.3", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz", + "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", + "dev": true, + "requires": { + "safer-buffer": ">= 2.1.2 < 3.0.0" + } + }, + "webidl-conversions": { + "version": "7.0.0", + "resolved": "https://registry.npmjs.org/webidl-conversions/-/webidl-conversions-7.0.0.tgz", + "integrity": "sha512-VwddBukDzu71offAQR975unBIGqfKZpM+8ZX6ySk8nYhVoo5CYaZyzt3YBvYtRtO+aoGlqxPg/B87NGVZ/fu6g==", + "dev": true + } + } + }, "hard-rejection": { "version": "2.1.0" }, @@ -30928,8 +31066,7 @@ } }, "has-bigints": { - "version": "1.0.2", - "dev": true + "version": "1.0.2" }, "has-flag": { "version": "4.0.0" @@ -30945,7 +31082,6 @@ }, "has-tostringtag": { "version": "1.0.0", - "dev": true, "requires": { "has-symbols": "^1.0.2" } @@ -30988,6 +31124,12 @@ "hast-util-whitespace": { "version": "2.0.0" }, + "he": { + "version": "1.2.0", + "resolved": "https://registry.npmjs.org/he/-/he-1.2.0.tgz", + "integrity": "sha512-F/1DnUGPopORZi0ni+CvrCgHQ5FyEAHRLSApuYWMmrbSwoN2Mn/7k+Gl38gJnR7yyDZk6WLXwiGod1JOWNDKGw==", + "dev": true + }, "header-case": { "version": "2.0.4", "requires": { @@ -31006,7 +31148,7 @@ "@remix-run/dev": "1.12.0", "@remix-run/react": "1.12.0", "@shopify/cli": "3.29.0", - "@shopify/cli-hydrogen": "^4.0.7", + "@shopify/cli-hydrogen": "^4.0.8", "@shopify/hydrogen": "^2023.1.5", "@shopify/oxygen-workers-types": "^3.17.2", "@shopify/prettier-config": "^1.1.2", @@ -31268,7 +31410,6 @@ }, "internal-slot": { "version": "1.0.3", - "dev": true, "requires": { "get-intrinsic": "^1.1.0", "has": "^1.0.3", @@ -31297,7 +31438,6 @@ }, "is-arguments": { "version": "1.1.1", - "dev": true, "requires": { "call-bind": "^1.0.2", "has-tostringtag": "^1.0.0" @@ -31308,7 +31448,6 @@ }, "is-bigint": { "version": "1.0.4", - "dev": true, "requires": { "has-bigints": "^1.0.1" } @@ -31321,7 +31460,6 @@ }, "is-boolean-object": { "version": "1.1.2", - "dev": true, "requires": { "call-bind": "^1.0.2", "has-tostringtag": "^1.0.0" @@ -31331,8 +31469,7 @@ "version": "2.0.5" }, "is-callable": { - "version": "1.2.6", - "dev": true + "version": "1.2.6" }, "is-ci": { "version": "1.2.1", @@ -31349,7 +31486,6 @@ }, "is-date-object": { "version": "1.0.5", - "dev": true, "requires": { "has-tostringtag": "^1.0.0" } @@ -31396,19 +31532,16 @@ "dev": true }, "is-map": { - "version": "2.0.2", - "dev": true + "version": "2.0.2" }, "is-negative-zero": { - "version": "2.0.2", - "dev": true + "version": "2.0.2" }, "is-number": { "version": "7.0.0" }, "is-number-object": { "version": "1.0.7", - "dev": true, "requires": { "has-tostringtag": "^1.0.0" } @@ -31438,7 +31571,6 @@ }, "is-regex": { "version": "1.1.4", - "dev": true, "requires": { "call-bind": "^1.0.2", "has-tostringtag": "^1.0.0" @@ -31459,12 +31591,10 @@ } }, "is-set": { - "version": "2.0.2", - "dev": true + "version": "2.0.2" }, "is-shared-array-buffer": { "version": "1.0.2", - "dev": true, "requires": { "call-bind": "^1.0.2" } @@ -31474,7 +31604,6 @@ }, "is-string": { "version": "1.0.7", - "dev": true, "requires": { "has-tostringtag": "^1.0.0" } @@ -31490,14 +31619,12 @@ }, "is-symbol": { "version": "1.0.4", - "dev": true, "requires": { "has-symbols": "^1.0.2" } }, "is-typed-array": { "version": "1.1.9", - "dev": true, "requires": { "available-typed-arrays": "^1.0.5", "call-bind": "^1.0.2", @@ -31514,19 +31641,16 @@ "dev": true }, "is-weakmap": { - "version": "2.0.1", - "dev": true + "version": "2.0.1" }, "is-weakref": { "version": "1.0.2", - "dev": true, "requires": { "call-bind": "^1.0.2" } }, "is-weakset": { "version": "2.0.2", - "dev": true, "requires": { "call-bind": "^1.0.2", "get-intrinsic": "^1.1.1" @@ -32067,8 +32191,7 @@ } }, "lz-string": { - "version": "1.4.4", - "dev": true + "version": "1.4.4" }, "macaddress": { "version": "0.5.3" @@ -33217,7 +33340,6 @@ }, "object-is": { "version": "1.1.5", - "dev": true, "requires": { "call-bind": "^1.0.2", "define-properties": "^1.1.3" @@ -34306,7 +34428,6 @@ }, "pretty-format": { "version": "27.5.1", - "dev": true, "requires": { "ansi-regex": "^5.0.1", "ansi-styles": "^5.0.0", @@ -34314,8 +34435,7 @@ }, "dependencies": { "ansi-styles": { - "version": "5.2.0", - "dev": true + "version": "5.2.0" } } }, @@ -34509,8 +34629,7 @@ "requires": {} }, "react-is": { - "version": "17.0.2", - "dev": true + "version": "17.0.2" }, "react-router": { "version": "6.8.0", @@ -34803,7 +34922,6 @@ }, "regexp.prototype.flags": { "version": "1.4.3", - "dev": true, "requires": { "call-bind": "^1.0.2", "define-properties": "^1.1.3", @@ -35214,7 +35332,7 @@ "@remix-run/dev": "1.12.0", "@remix-run/react": "1.12.0", "@shopify/cli": "3.29.0", - "@shopify/cli-hydrogen": "^4.0.7", + "@shopify/cli-hydrogen": "^4.0.8", "@shopify/hydrogen": "^2023.1.5", "@shopify/oxygen-workers-types": "^3.17.2", "@shopify/prettier-config": "^1.1.2", @@ -35655,7 +35773,6 @@ }, "string.prototype.trimend": { "version": "1.0.5", - "dev": true, "requires": { "call-bind": "^1.0.2", "define-properties": "^1.1.4", @@ -35664,7 +35781,6 @@ }, "string.prototype.trimstart": { "version": "1.0.5", - "dev": true, "requires": { "call-bind": "^1.0.2", "define-properties": "^1.1.4", @@ -36415,7 +36531,6 @@ }, "unbox-primitive": { "version": "1.0.2", - "dev": true, "requires": { "call-bind": "^1.0.2", "has-bigints": "^1.0.2", @@ -36852,6 +36967,32 @@ "webidl-conversions": { "version": "3.0.1" }, + "whatwg-encoding": { + "version": "2.0.0", + "resolved": "https://registry.npmjs.org/whatwg-encoding/-/whatwg-encoding-2.0.0.tgz", + "integrity": "sha512-p41ogyeMUrw3jWclHWTQg1k05DSVXPLcVxRTYsXUk+ZooOCZLcoYgPZ/HL/D/N+uQPOtcp1me1WhBEaX02mhWg==", + "dev": true, + "requires": { + "iconv-lite": "0.6.3" + }, + "dependencies": { + "iconv-lite": { + "version": "0.6.3", + "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.6.3.tgz", + "integrity": "sha512-4fCk79wshMdzMp2rH06qWrJE4iolqLhCUH+OiuIgU++RB0+94NlDL81atO7GX55uUKueo0txHNtvEyI6D7WdMw==", + "dev": true, + "requires": { + "safer-buffer": ">= 2.1.2 < 3.0.0" + } + } + } + }, + "whatwg-mimetype": { + "version": "3.0.0", + "resolved": "https://registry.npmjs.org/whatwg-mimetype/-/whatwg-mimetype-3.0.0.tgz", + "integrity": "sha512-nt+N2dzIutVRxARx1nghPKGv1xHikU7HKdfafKkLNLindmPU/ch3U31NOCGGA/dmPcmb1VlofO0vnKAcsm0o/Q==", + "dev": true + }, "whatwg-url": { "version": "5.0.0", "requires": { @@ -36867,7 +37008,6 @@ }, "which-boxed-primitive": { "version": "1.0.2", - "dev": true, "requires": { "is-bigint": "^1.0.1", "is-boolean-object": "^1.1.0", @@ -36878,7 +37018,6 @@ }, "which-collection": { "version": "1.0.1", - "dev": true, "requires": { "is-map": "^2.0.1", "is-set": "^2.0.1", @@ -36900,7 +37039,6 @@ }, "which-typed-array": { "version": "1.1.8", - "dev": true, "requires": { "available-typed-arrays": "^1.0.5", "call-bind": "^1.0.2", diff --git a/packages/hydrogen/package.json b/packages/hydrogen/package.json index 01d98efad4..68a3733a2b 100644 --- a/packages/hydrogen/package.json +++ b/packages/hydrogen/package.json @@ -59,7 +59,9 @@ "@remix-run/server-runtime": "1.12.0" }, "devDependencies": { + "happy-dom": "^8.9.0", "schema-dts": "^1.1.0", - "vitest": "^0.27.2" + "vitest": "^0.27.2", + "@testing-library/react": "^14.0.0" } } diff --git a/packages/hydrogen/src/seo/seo.test.tsx b/packages/hydrogen/src/seo/seo.test.tsx new file mode 100644 index 0000000000..0fe2ddf87b --- /dev/null +++ b/packages/hydrogen/src/seo/seo.test.tsx @@ -0,0 +1,153 @@ +import {createElement} from 'react'; +import {vi, expect, it, describe, afterEach} from 'vitest'; +import {useMatches, Location, RouteMatch} from '@remix-run/react'; +import {render, cleanup} from '@testing-library/react'; + +import {Seo} from './seo'; + +vi.mock('@remix-run/react', () => ({ + useMatches: vi.fn(), + useLocation: vi.fn(() => fillLocation()), +})); + +describe('seo', () => { + afterEach(() => { + cleanup(); + vi.resetAllMocks(); + }); + + it('uses seo loader data to generate the meta tags', async () => { + vi.mocked(useMatches).mockReturnValueOnce([ + fillMatch({ + data: { + seo: {title: 'Snow devil', description: 'A hydrogen storefront'}, + }, + }), + ]); + + const {asFragment} = render(createElement(Seo)); + + expect(asFragment()).toMatchInlineSnapshot(` + + + Snow devil + + + + + + + + + + + `); + }); + + it('takes the latest route match', async () => { + vi.mocked(useMatches).mockReturnValueOnce([ + fillMatch({ + data: { + seo: {title: 'Snow devil', description: 'A hydrogen storefront'}, + }, + }), + fillMatch({ + data: { + seo: {title: 'Sand devil'}, + }, + }), + ]); + + const {asFragment} = render(createElement(Seo)); + + expect(asFragment()).toMatchInlineSnapshot(` + + + Sand devil + + + + + + + + + + + `); + }); +}); + +function fillMatch(partial: Partial = {}) { + return { + id: 'root', + pathname: '/', + params: { + productHandle: 'shopify-aurora', + }, + handle: {}, + data: {}, + ...partial, + }; +} + +function fillLocation(partial: Partial = {}) { + return { + key: '', + pathname: '/', + search: '', + hash: '', + state: null, + ...partial, + }; +} diff --git a/packages/hydrogen/src/seo/seo.ts b/packages/hydrogen/src/seo/seo.ts index 696002d858..8522331a77 100644 --- a/packages/hydrogen/src/seo/seo.ts +++ b/packages/hydrogen/src/seo/seo.ts @@ -45,7 +45,18 @@ export function Seo({debug}: SeoProps) { const routeInfo = {...routeMatch, ...location}; if (handle === undefined || handle.seo === undefined) { - return []; + if ( + routeMatch.data === undefined || + routeMatch.data.seo === undefined + ) { + return []; + } + + return [ + { + ...routeMatch.data.seo, + }, + ]; } return recursivelyInvokeOrReturn(handle.seo, routeInfo); diff --git a/packages/hydrogen/vitest.config.ts b/packages/hydrogen/vitest.config.ts new file mode 100644 index 0000000000..ee1edf9a36 --- /dev/null +++ b/packages/hydrogen/vitest.config.ts @@ -0,0 +1,7 @@ +import {defineConfig} from 'vitest/config'; + +export default defineConfig({ + test: { + environment: 'happy-dom', + }, +}); diff --git a/templates/demo-store/app/routes/($lang)/products/$productHandle.tsx b/templates/demo-store/app/routes/($lang)/products/$productHandle.tsx index 377565e501..84ae2cec75 100644 --- a/templates/demo-store/app/routes/($lang)/products/$productHandle.tsx +++ b/templates/demo-store/app/routes/($lang)/products/$productHandle.tsx @@ -47,28 +47,6 @@ import {MEDIA_FRAGMENT, PRODUCT_CARD_FRAGMENT} from '~/data/fragments'; import type {Storefront} from '~/lib/type'; import type {Product} from 'schema-dts'; -const seo: SeoHandleFunction = ({data}) => { - const media = flattenConnection(data.product.media).find( - (media) => media.mediaContentType === 'IMAGE', - ) as MediaImage | undefined; - - return { - title: data?.product?.seo?.title ?? data?.product?.title, - media: media?.image, - description: data?.product?.seo?.description ?? data?.product?.description, - jsonLd: { - '@context': 'https://schema.org', - '@type': 'Product', - brand: data?.product?.vendor, - name: data?.product?.title, - }, - } satisfies SeoConfig; -}; - -export const handle = { - seo, -}; - export async function loader({params, request, context}: LoaderArgs) { const {productHandle} = params; invariant(productHandle, 'Missing productHandle param, check route filename'); @@ -109,10 +87,27 @@ export async function loader({params, request, context}: LoaderArgs) { price: selectedVariant.price.amount, }; + const media = flattenConnection(product.media).find( + (media) => media.mediaContentType === 'IMAGE', + ) as MediaImage | undefined; + + const seo = { + title: product?.seo?.title ?? product?.title, + media: media?.image, + description: product?.seo?.description ?? product?.description, + jsonLd: { + '@context': 'https://schema.org', + '@type': 'Product', + brand: product?.vendor, + name: product?.title, + }, + } satisfies SeoConfig; + return defer({ product, shop, recommended, + seo, analytics: { pageType: AnalyticsPageType.product, resourceId: product.id, From ac283047c6f397b8d8784a09a51d83f952eea49c Mon Sep 17 00:00:00 2001 From: Matt Seccafien <462077+cartogram@users.noreply.github.com> Date: Mon, 27 Feb 2023 17:41:47 +0100 Subject: [PATCH 2/3] Update package-lock.json --- package-lock.json | 138 +++++++++++++++++++++++++++++++++++++++------- 1 file changed, 118 insertions(+), 20 deletions(-) diff --git a/package-lock.json b/package-lock.json index 69fa04a044..4b43ca4f9d 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,5 +1,5 @@ { - "name": "h2", + "name": "hydrogen", "lockfileVersion": 2, "requires": true, "packages": { @@ -5968,6 +5968,7 @@ "version": "14.0.0", "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-14.0.0.tgz", "integrity": "sha512-S04gSNJbYE30TlIMLTzv6QCTzt9AqIF5y6s6SzVFILNcNvbV/jU96GeiTPillGQo+Ny64M/5PV7klNYYgv5Dfg==", + "dev": true, "dependencies": { "@babel/runtime": "^7.12.5", "@testing-library/dom": "^9.0.0", @@ -5985,6 +5986,7 @@ "version": "9.0.0", "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-9.0.0.tgz", "integrity": "sha512-+/TLgKNFsYUshOY/zXsQOk+PlFQK+eyJ9T13IDVNJEi+M+Un7xlJK+FZKkbGSnf0+7E1G6PlDhkSYQ/GFiruBQ==", + "dev": true, "dependencies": { "@babel/code-frame": "^7.10.4", "@babel/runtime": "^7.12.5", @@ -6002,7 +6004,8 @@ "node_modules/@testing-library/react/node_modules/@types/aria-query": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.1.tgz", - "integrity": "sha512-XTIieEY+gvJ39ChLcB4If5zHtPxt3Syj5rgZR+e1ctpmK8NjPf0zFqsz4JpLJT0xla9GFDKjy8Cpu331nrmE1Q==" + "integrity": "sha512-XTIieEY+gvJ39ChLcB4If5zHtPxt3Syj5rgZR+e1ctpmK8NjPf0zFqsz4JpLJT0xla9GFDKjy8Cpu331nrmE1Q==", + "dev": true }, "node_modules/@tootallnate/once": { "version": "1.1.2", @@ -6236,6 +6239,7 @@ }, "node_modules/@types/react-dom": { "version": "18.0.6", + "dev": true, "license": "MIT", "dependencies": { "@types/react": "*" @@ -7255,6 +7259,7 @@ }, "node_modules/aria-query": { "version": "5.1.1", + "dev": true, "license": "Apache-2.0", "dependencies": { "deep-equal": "^2.0.5" @@ -7458,6 +7463,7 @@ }, "node_modules/available-typed-arrays": { "version": "1.0.5", + "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -9247,6 +9253,7 @@ }, "node_modules/deep-equal": { "version": "2.0.5", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.0", @@ -9271,6 +9278,7 @@ }, "node_modules/deep-equal/node_modules/isarray": { "version": "2.0.5", + "dev": true, "license": "MIT" }, "node_modules/deep-extend": { @@ -9524,6 +9532,7 @@ }, "node_modules/dom-accessibility-api": { "version": "0.5.14", + "dev": true, "license": "MIT" }, "node_modules/dot-case": { @@ -9737,6 +9746,7 @@ }, "node_modules/es-abstract": { "version": "1.20.2", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -9772,6 +9782,7 @@ }, "node_modules/es-get-iterator": { "version": "1.1.2", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -9789,6 +9800,7 @@ }, "node_modules/es-get-iterator/node_modules/isarray": { "version": "2.0.5", + "dev": true, "license": "MIT" }, "node_modules/es-shim-unscopables": { @@ -9801,6 +9813,7 @@ }, "node_modules/es-to-primitive": { "version": "1.2.1", + "dev": true, "license": "MIT", "dependencies": { "is-callable": "^1.1.4", @@ -11419,6 +11432,7 @@ }, "node_modules/for-each": { "version": "0.3.3", + "dev": true, "license": "MIT", "dependencies": { "is-callable": "^1.1.3" @@ -11559,6 +11573,7 @@ }, "node_modules/function.prototype.name": { "version": "1.1.5", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -11575,6 +11590,7 @@ }, "node_modules/functions-have-names": { "version": "1.2.3", + "dev": true, "license": "MIT", "funding": { "url": "https://github.com/sponsors/ljharb" @@ -11722,6 +11738,7 @@ }, "node_modules/get-symbol-description": { "version": "1.0.0", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -12092,6 +12109,7 @@ }, "node_modules/has-bigints": { "version": "1.0.2", + "dev": true, "license": "MIT", "funding": { "url": "https://github.com/sponsors/ljharb" @@ -12126,6 +12144,7 @@ }, "node_modules/has-tostringtag": { "version": "1.0.0", + "dev": true, "license": "MIT", "dependencies": { "has-symbols": "^1.0.2" @@ -12595,6 +12614,7 @@ }, "node_modules/internal-slot": { "version": "1.0.3", + "dev": true, "license": "MIT", "dependencies": { "get-intrinsic": "^1.1.0", @@ -12646,6 +12666,7 @@ }, "node_modules/is-arguments": { "version": "1.1.1", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -12664,6 +12685,7 @@ }, "node_modules/is-bigint": { "version": "1.0.4", + "dev": true, "license": "MIT", "dependencies": { "has-bigints": "^1.0.1" @@ -12684,6 +12706,7 @@ }, "node_modules/is-boolean-object": { "version": "1.1.2", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -12719,6 +12742,7 @@ }, "node_modules/is-callable": { "version": "1.2.6", + "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -12750,6 +12774,7 @@ }, "node_modules/is-date-object": { "version": "1.0.5", + "dev": true, "license": "MIT", "dependencies": { "has-tostringtag": "^1.0.0" @@ -12853,6 +12878,7 @@ }, "node_modules/is-map": { "version": "2.0.2", + "dev": true, "license": "MIT", "funding": { "url": "https://github.com/sponsors/ljharb" @@ -12860,6 +12886,7 @@ }, "node_modules/is-negative-zero": { "version": "2.0.2", + "dev": true, "license": "MIT", "engines": { "node": ">= 0.4" @@ -12877,6 +12904,7 @@ }, "node_modules/is-number-object": { "version": "1.0.7", + "dev": true, "license": "MIT", "dependencies": { "has-tostringtag": "^1.0.0" @@ -12931,6 +12959,7 @@ }, "node_modules/is-regex": { "version": "1.1.4", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -12971,6 +13000,7 @@ }, "node_modules/is-set": { "version": "2.0.2", + "dev": true, "license": "MIT", "funding": { "url": "https://github.com/sponsors/ljharb" @@ -12978,6 +13008,7 @@ }, "node_modules/is-shared-array-buffer": { "version": "1.0.2", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2" @@ -12998,6 +13029,7 @@ }, "node_modules/is-string": { "version": "1.0.7", + "dev": true, "license": "MIT", "dependencies": { "has-tostringtag": "^1.0.0" @@ -13023,6 +13055,7 @@ }, "node_modules/is-symbol": { "version": "1.0.4", + "dev": true, "license": "MIT", "dependencies": { "has-symbols": "^1.0.2" @@ -13036,6 +13069,7 @@ }, "node_modules/is-typed-array": { "version": "1.1.9", + "dev": true, "license": "MIT", "dependencies": { "available-typed-arrays": "^1.0.5", @@ -13068,6 +13102,7 @@ }, "node_modules/is-weakmap": { "version": "2.0.1", + "dev": true, "license": "MIT", "funding": { "url": "https://github.com/sponsors/ljharb" @@ -13075,6 +13110,7 @@ }, "node_modules/is-weakref": { "version": "1.0.2", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2" @@ -13085,6 +13121,7 @@ }, "node_modules/is-weakset": { "version": "2.0.2", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -13914,6 +13951,7 @@ }, "node_modules/lz-string": { "version": "1.4.4", + "dev": true, "license": "WTFPL", "bin": { "lz-string": "bin/bin.js" @@ -15818,6 +15856,7 @@ }, "node_modules/object-is": { "version": "1.1.5", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -17676,6 +17715,7 @@ }, "node_modules/pretty-format": { "version": "27.5.1", + "dev": true, "license": "MIT", "dependencies": { "ansi-regex": "^5.0.1", @@ -17688,6 +17728,7 @@ }, "node_modules/pretty-format/node_modules/ansi-styles": { "version": "5.2.0", + "dev": true, "license": "MIT", "engines": { "node": ">=10" @@ -17998,6 +18039,7 @@ }, "node_modules/react-is": { "version": "17.0.2", + "dev": true, "license": "MIT" }, "node_modules/react-router": { @@ -18428,6 +18470,7 @@ }, "node_modules/regexp.prototype.flags": { "version": "1.4.3", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -19701,6 +19744,7 @@ }, "node_modules/string.prototype.trimend": { "version": "1.0.5", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -19713,6 +19757,7 @@ }, "node_modules/string.prototype.trimstart": { "version": "1.0.5", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -20933,6 +20978,7 @@ }, "node_modules/unbox-primitive": { "version": "1.0.2", + "dev": true, "license": "MIT", "dependencies": { "call-bind": "^1.0.2", @@ -21730,6 +21776,7 @@ }, "node_modules/which-boxed-primitive": { "version": "1.0.2", + "dev": true, "license": "MIT", "dependencies": { "is-bigint": "^1.0.1", @@ -21744,6 +21791,7 @@ }, "node_modules/which-collection": { "version": "1.0.1", + "dev": true, "license": "MIT", "dependencies": { "is-map": "^2.0.1", @@ -21774,6 +21822,7 @@ }, "node_modules/which-typed-array": { "version": "1.1.8", + "dev": true, "license": "MIT", "dependencies": { "available-typed-arrays": "^1.0.5", @@ -22815,10 +22864,10 @@ "version": "2023.1.5", "license": "SEE LICENSE IN LICENSE.md", "dependencies": { - "@shopify/hydrogen-react": "2023.1.5", - "@testing-library/react": "^14.0.0" + "@shopify/hydrogen-react": "2023.1.5" }, "devDependencies": { + "@testing-library/react": "^14.0.0", "happy-dom": "^8.9.0", "schema-dts": "^1.1.0", "vitest": "^0.27.2" @@ -26674,7 +26723,7 @@ "requires": { "@shopify/hydrogen-react": "2023.1.5", "@testing-library/react": "^14.0.0", - "happy-dom": "*", + "happy-dom": "^8.9.0", "schema-dts": "^1.1.0", "vitest": "^0.27.2" }, @@ -27121,6 +27170,7 @@ "version": "14.0.0", "resolved": "https://registry.npmjs.org/@testing-library/react/-/react-14.0.0.tgz", "integrity": "sha512-S04gSNJbYE30TlIMLTzv6QCTzt9AqIF5y6s6SzVFILNcNvbV/jU96GeiTPillGQo+Ny64M/5PV7klNYYgv5Dfg==", + "dev": true, "requires": { "@babel/runtime": "^7.12.5", "@testing-library/dom": "^9.0.0", @@ -27131,6 +27181,7 @@ "version": "9.0.0", "resolved": "https://registry.npmjs.org/@testing-library/dom/-/dom-9.0.0.tgz", "integrity": "sha512-+/TLgKNFsYUshOY/zXsQOk+PlFQK+eyJ9T13IDVNJEi+M+Un7xlJK+FZKkbGSnf0+7E1G6PlDhkSYQ/GFiruBQ==", + "dev": true, "requires": { "@babel/code-frame": "^7.10.4", "@babel/runtime": "^7.12.5", @@ -27145,7 +27196,8 @@ "@types/aria-query": { "version": "5.0.1", "resolved": "https://registry.npmjs.org/@types/aria-query/-/aria-query-5.0.1.tgz", - "integrity": "sha512-XTIieEY+gvJ39ChLcB4If5zHtPxt3Syj5rgZR+e1ctpmK8NjPf0zFqsz4JpLJT0xla9GFDKjy8Cpu331nrmE1Q==" + "integrity": "sha512-XTIieEY+gvJ39ChLcB4If5zHtPxt3Syj5rgZR+e1ctpmK8NjPf0zFqsz4JpLJT0xla9GFDKjy8Cpu331nrmE1Q==", + "dev": true } } }, @@ -27340,6 +27392,7 @@ }, "@types/react-dom": { "version": "18.0.6", + "dev": true, "requires": { "@types/react": "*" } @@ -27990,6 +28043,7 @@ }, "aria-query": { "version": "5.1.1", + "dev": true, "requires": { "deep-equal": "^2.0.5" } @@ -28103,7 +28157,8 @@ } }, "available-typed-arrays": { - "version": "1.0.5" + "version": "1.0.5", + "dev": true }, "aws-sdk": { "version": "2.1278.0", @@ -29186,6 +29241,7 @@ }, "deep-equal": { "version": "2.0.5", + "dev": true, "requires": { "call-bind": "^1.0.0", "es-get-iterator": "^1.1.1", @@ -29205,7 +29261,8 @@ }, "dependencies": { "isarray": { - "version": "2.0.5" + "version": "2.0.5", + "dev": true } } }, @@ -29401,7 +29458,8 @@ } }, "dom-accessibility-api": { - "version": "0.5.14" + "version": "0.5.14", + "dev": true }, "dot-case": { "version": "3.0.4", @@ -29551,6 +29609,7 @@ }, "es-abstract": { "version": "1.20.2", + "dev": true, "requires": { "call-bind": "^1.0.2", "es-to-primitive": "^1.2.1", @@ -29579,6 +29638,7 @@ }, "es-get-iterator": { "version": "1.1.2", + "dev": true, "requires": { "call-bind": "^1.0.2", "get-intrinsic": "^1.1.0", @@ -29591,7 +29651,8 @@ }, "dependencies": { "isarray": { - "version": "2.0.5" + "version": "2.0.5", + "dev": true } } }, @@ -29604,6 +29665,7 @@ }, "es-to-primitive": { "version": "1.2.1", + "dev": true, "requires": { "is-callable": "^1.1.4", "is-date-object": "^1.0.1", @@ -30633,6 +30695,7 @@ }, "for-each": { "version": "0.3.3", + "dev": true, "requires": { "is-callable": "^1.1.3" } @@ -30724,6 +30787,7 @@ }, "function.prototype.name": { "version": "1.1.5", + "dev": true, "requires": { "call-bind": "^1.0.2", "define-properties": "^1.1.3", @@ -30732,7 +30796,8 @@ } }, "functions-have-names": { - "version": "1.2.3" + "version": "1.2.3", + "dev": true }, "fuzzy": { "version": "0.1.3" @@ -30821,6 +30886,7 @@ }, "get-symbol-description": { "version": "1.0.0", + "dev": true, "requires": { "call-bind": "^1.0.2", "get-intrinsic": "^1.1.1" @@ -31066,7 +31132,8 @@ } }, "has-bigints": { - "version": "1.0.2" + "version": "1.0.2", + "dev": true }, "has-flag": { "version": "4.0.0" @@ -31082,6 +31149,7 @@ }, "has-tostringtag": { "version": "1.0.0", + "dev": true, "requires": { "has-symbols": "^1.0.2" } @@ -31410,6 +31478,7 @@ }, "internal-slot": { "version": "1.0.3", + "dev": true, "requires": { "get-intrinsic": "^1.1.0", "has": "^1.0.3", @@ -31438,6 +31507,7 @@ }, "is-arguments": { "version": "1.1.1", + "dev": true, "requires": { "call-bind": "^1.0.2", "has-tostringtag": "^1.0.0" @@ -31448,6 +31518,7 @@ }, "is-bigint": { "version": "1.0.4", + "dev": true, "requires": { "has-bigints": "^1.0.1" } @@ -31460,6 +31531,7 @@ }, "is-boolean-object": { "version": "1.1.2", + "dev": true, "requires": { "call-bind": "^1.0.2", "has-tostringtag": "^1.0.0" @@ -31469,7 +31541,8 @@ "version": "2.0.5" }, "is-callable": { - "version": "1.2.6" + "version": "1.2.6", + "dev": true }, "is-ci": { "version": "1.2.1", @@ -31486,6 +31559,7 @@ }, "is-date-object": { "version": "1.0.5", + "dev": true, "requires": { "has-tostringtag": "^1.0.0" } @@ -31532,16 +31606,19 @@ "dev": true }, "is-map": { - "version": "2.0.2" + "version": "2.0.2", + "dev": true }, "is-negative-zero": { - "version": "2.0.2" + "version": "2.0.2", + "dev": true }, "is-number": { "version": "7.0.0" }, "is-number-object": { "version": "1.0.7", + "dev": true, "requires": { "has-tostringtag": "^1.0.0" } @@ -31571,6 +31648,7 @@ }, "is-regex": { "version": "1.1.4", + "dev": true, "requires": { "call-bind": "^1.0.2", "has-tostringtag": "^1.0.0" @@ -31591,10 +31669,12 @@ } }, "is-set": { - "version": "2.0.2" + "version": "2.0.2", + "dev": true }, "is-shared-array-buffer": { "version": "1.0.2", + "dev": true, "requires": { "call-bind": "^1.0.2" } @@ -31604,6 +31684,7 @@ }, "is-string": { "version": "1.0.7", + "dev": true, "requires": { "has-tostringtag": "^1.0.0" } @@ -31619,12 +31700,14 @@ }, "is-symbol": { "version": "1.0.4", + "dev": true, "requires": { "has-symbols": "^1.0.2" } }, "is-typed-array": { "version": "1.1.9", + "dev": true, "requires": { "available-typed-arrays": "^1.0.5", "call-bind": "^1.0.2", @@ -31641,16 +31724,19 @@ "dev": true }, "is-weakmap": { - "version": "2.0.1" + "version": "2.0.1", + "dev": true }, "is-weakref": { "version": "1.0.2", + "dev": true, "requires": { "call-bind": "^1.0.2" } }, "is-weakset": { "version": "2.0.2", + "dev": true, "requires": { "call-bind": "^1.0.2", "get-intrinsic": "^1.1.1" @@ -32191,7 +32277,8 @@ } }, "lz-string": { - "version": "1.4.4" + "version": "1.4.4", + "dev": true }, "macaddress": { "version": "0.5.3" @@ -33340,6 +33427,7 @@ }, "object-is": { "version": "1.1.5", + "dev": true, "requires": { "call-bind": "^1.0.2", "define-properties": "^1.1.3" @@ -34428,6 +34516,7 @@ }, "pretty-format": { "version": "27.5.1", + "dev": true, "requires": { "ansi-regex": "^5.0.1", "ansi-styles": "^5.0.0", @@ -34435,7 +34524,8 @@ }, "dependencies": { "ansi-styles": { - "version": "5.2.0" + "version": "5.2.0", + "dev": true } } }, @@ -34629,7 +34719,8 @@ "requires": {} }, "react-is": { - "version": "17.0.2" + "version": "17.0.2", + "dev": true }, "react-router": { "version": "6.8.0", @@ -34922,6 +35013,7 @@ }, "regexp.prototype.flags": { "version": "1.4.3", + "dev": true, "requires": { "call-bind": "^1.0.2", "define-properties": "^1.1.3", @@ -35773,6 +35865,7 @@ }, "string.prototype.trimend": { "version": "1.0.5", + "dev": true, "requires": { "call-bind": "^1.0.2", "define-properties": "^1.1.4", @@ -35781,6 +35874,7 @@ }, "string.prototype.trimstart": { "version": "1.0.5", + "dev": true, "requires": { "call-bind": "^1.0.2", "define-properties": "^1.1.4", @@ -36531,6 +36625,7 @@ }, "unbox-primitive": { "version": "1.0.2", + "dev": true, "requires": { "call-bind": "^1.0.2", "has-bigints": "^1.0.2", @@ -37008,6 +37103,7 @@ }, "which-boxed-primitive": { "version": "1.0.2", + "dev": true, "requires": { "is-bigint": "^1.0.1", "is-boolean-object": "^1.1.0", @@ -37018,6 +37114,7 @@ }, "which-collection": { "version": "1.0.1", + "dev": true, "requires": { "is-map": "^2.0.1", "is-set": "^2.0.1", @@ -37039,6 +37136,7 @@ }, "which-typed-array": { "version": "1.1.8", + "dev": true, "requires": { "available-typed-arrays": "^1.0.5", "call-bind": "^1.0.2", From 1be234de712158ccb5c249bc038ad1c56c2fb992 Mon Sep 17 00:00:00 2001 From: Matt Seccafien <462077+cartogram@users.noreply.github.com> Date: Mon, 27 Feb 2023 19:49:13 +0100 Subject: [PATCH 3/3] Minor tweaks to SEO component and add changelog --- .changeset/curly-spies-hunt.md | 5 +++++ packages/hydrogen/src/seo/{seo.test.tsx => seo.test.ts} | 0 packages/hydrogen/src/seo/seo.ts | 5 +---- 3 files changed, 6 insertions(+), 4 deletions(-) create mode 100644 .changeset/curly-spies-hunt.md rename packages/hydrogen/src/seo/{seo.test.tsx => seo.test.ts} (100%) diff --git a/.changeset/curly-spies-hunt.md b/.changeset/curly-spies-hunt.md new file mode 100644 index 0000000000..2f572d72ce --- /dev/null +++ b/.changeset/curly-spies-hunt.md @@ -0,0 +1,5 @@ +--- +'@shopify/hydrogen': patch +--- + +Add new `loader` API for setting seo tags within route module diff --git a/packages/hydrogen/src/seo/seo.test.tsx b/packages/hydrogen/src/seo/seo.test.ts similarity index 100% rename from packages/hydrogen/src/seo/seo.test.tsx rename to packages/hydrogen/src/seo/seo.test.ts diff --git a/packages/hydrogen/src/seo/seo.ts b/packages/hydrogen/src/seo/seo.ts index 8522331a77..b5db3a2983 100644 --- a/packages/hydrogen/src/seo/seo.ts +++ b/packages/hydrogen/src/seo/seo.ts @@ -45,10 +45,7 @@ export function Seo({debug}: SeoProps) { const routeInfo = {...routeMatch, ...location}; if (handle === undefined || handle.seo === undefined) { - if ( - routeMatch.data === undefined || - routeMatch.data.seo === undefined - ) { + if (!routeMatch?.data?.seo) { return []; }