diff --git a/package-lock.json b/package-lock.json
index 6161d82..b738b69 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1658,6 +1658,15 @@
"csstype": "^2.2.0"
}
},
+ "@types/react-test-renderer": {
+ "version": "16.9.1",
+ "resolved": "https://registry.npmjs.org/@types/react-test-renderer/-/react-test-renderer-16.9.1.tgz",
+ "integrity": "sha512-nCXQokZN1jp+QkoDNmDZwoWpKY8HDczqevIDO4Uv9/s9rbGPbSpy8Uaxa5ixHKkcm/Wt0Y9C3wCxZivh4Al+rQ==",
+ "dev": true,
+ "requires": {
+ "@types/react": "*"
+ }
+ },
"@types/retry": {
"version": "0.12.0",
"resolved": "https://registry.npmjs.org/@types/retry/-/retry-0.12.0.tgz",
@@ -11786,6 +11795,18 @@
"integrity": "sha512-aUk3bHfZ2bRSVFFbbeVS4i+lNPZr3/WM5jT2J5omUVV1zzcs1nAaf3l51ctA5FFvCRbhrH0bdAsRRQddFJZPtA==",
"dev": true
},
+ "react-test-renderer": {
+ "version": "16.12.0",
+ "resolved": "https://registry.npmjs.org/react-test-renderer/-/react-test-renderer-16.12.0.tgz",
+ "integrity": "sha512-Vj/teSqt2oayaWxkbhQ6gKis+t5JrknXfPVo+aIJ8QwYAqMPH77uptOdrlphyxl8eQI/rtkOYg86i/UWkpFu0w==",
+ "dev": true,
+ "requires": {
+ "object-assign": "^4.1.1",
+ "prop-types": "^15.6.2",
+ "react-is": "^16.8.6",
+ "scheduler": "^0.18.0"
+ }
+ },
"read-pkg": {
"version": "3.0.0",
"resolved": "https://registry.npmjs.org/read-pkg/-/read-pkg-3.0.0.tgz",
@@ -12156,6 +12177,16 @@
"integrity": "sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==",
"dev": true
},
+ "scheduler": {
+ "version": "0.18.0",
+ "resolved": "https://registry.npmjs.org/scheduler/-/scheduler-0.18.0.tgz",
+ "integrity": "sha512-agTSHR1Nbfi6ulI0kYNK0203joW2Y5W4po4l+v03tOoiJKpTBbxpNhWDvqc/4IcOw+KLmSiQLTasZ4cab2/UWQ==",
+ "dev": true,
+ "requires": {
+ "loose-envify": "^1.1.0",
+ "object-assign": "^4.1.1"
+ }
+ },
"semantic-release": {
"version": "15.13.31",
"resolved": "https://registry.npmjs.org/semantic-release/-/semantic-release-15.13.31.tgz",
diff --git a/package.json b/package.json
index 89fab1f..8e14c02 100644
--- a/package.json
+++ b/package.json
@@ -51,6 +51,7 @@
"@types/jest": "^24.0.17",
"@types/node": "^12.7.2",
"@types/react": "^16.8.25",
+ "@types/react-test-renderer": "^16.9.1",
"@typescript-eslint/eslint-plugin": "^2.0.0",
"@typescript-eslint/parser": "^2.0.0",
"eslint": "^6.1.0",
@@ -63,6 +64,7 @@
"jest-runner-prettier": "^0.3.1",
"prettier": "^1.18.2",
"react": "^16.9.0",
+ "react-test-renderer": "^16.12.0",
"semantic-release": "^15.13.21",
"ts-jest": "^24.0.2",
"typescript": "^3.5.3"
diff --git a/src/__snapshots__/index.test.tsx.snap b/src/__snapshots__/index.test.tsx.snap
index 10c4e2d..e9e8e2e 100644
--- a/src/__snapshots__/index.test.tsx.snap
+++ b/src/__snapshots__/index.test.tsx.snap
@@ -8,6 +8,60 @@ exports[`Serialization function serializes a JSON+LD script element with data se
`;
+exports[`Serialization function serializes a script element created using React.createElement 1`] = `
+
+`;
+
+exports[`Serialization function serializes a script element with data correctly 1`] = `
+
+`;
+
+exports[`Serialization function serializes a script element wrapped in a component 1`] = `
+
+`;
+
+exports[`Serialization function serializes a wrapped script element with data correctly 1`] = `
+
+
+
+`;
+
exports[`Serialization module matches expectations 1`] = `
Object {
"print": [Function],
diff --git a/src/index.test.tsx b/src/index.test.tsx
index 1ed6a0e..6cb863d 100644
--- a/src/index.test.tsx
+++ b/src/index.test.tsx
@@ -1,4 +1,5 @@
import * as React from "react";
+import renderer from "react-test-renderer";
import serializer from ".";
describe("Serializer test function", () => {
@@ -65,6 +66,87 @@ describe("Serialization function", () => {
expect(ldScriptElement).toMatchSnapshot();
});
+
+ it("serializes a script element with data correctly", () => {
+ expect.addSnapshotSerializer(serializer);
+
+ const element = (
+
+ );
+
+ expect(element).toMatchSnapshot();
+ });
+
+ it("serializes a wrapped script element with data correctly", () => {
+ expect.addSnapshotSerializer(serializer);
+
+ const element = (
+
+
+
+ );
+
+ expect(element).toMatchSnapshot();
+ });
+
+ it("serializes a script element created using React.createElement", () => {
+ expect.addSnapshotSerializer(serializer);
+
+ const element = React.createElement("script", {
+ type: "application/ld+json",
+ dangerouslySetInnerHTML: {
+ __html: JSON.stringify({
+ "@context": "http://schema.org",
+ "@type": "Thing",
+ "@id": "https://example.dev/example_thing"
+ })
+ }
+ });
+
+ expect(element).toMatchSnapshot();
+ });
+
+ it("serializes a script element wrapped in a component", () => {
+ expect.addSnapshotSerializer(serializer);
+
+ const Component = () => (
+
+ );
+
+ const tree = renderer.create().toJSON();
+ expect(tree).toMatchSnapshot();
+ });
});
describe("Serialization module", () => {
diff --git a/src/index.tsx b/src/index.tsx
index a40daa5..9f50f84 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -1,22 +1,14 @@
-/* eslint-disable @typescript-eslint/no-explicit-any */
-
import * as React from "react";
-function hasValidProps(val: any): boolean {
- return Boolean(
- val.props.dangerouslySetInnerHTML &&
- val.props.type &&
- val.props.type === "application/ld+json"
- );
-}
-
const JSONLDSerializer: jest.SnapshotSerializerPlugin = {
test(val) {
return Boolean(
val &&
- React.isValidElement(val) &&
+ // React.isValidElement(val) && // Previously we were using this API to shortcut testing if an object was a React object, but this produces false negatives on elements wrapped in Components. While it might take longer to fail on some tests, it should produce a negligable effect.
val.type === "script" &&
- hasValidProps(val)
+ val.props.dangerouslySetInnerHTML &&
+ val.props.type &&
+ val.props.type === "application/ld+json"
);
},
diff --git a/tsconfig.json b/tsconfig.json
index 6e81a4c..da7b451 100644
--- a/tsconfig.json
+++ b/tsconfig.json
@@ -8,9 +8,9 @@
// "allowJs": true, /* Allow javascript files to be compiled. */
// "checkJs": true, /* Report errors in .js files. */
"jsx": "react" /* Specify JSX code generation: 'preserve', 'react-native', or 'react'. */,
- // "declaration": true, /* Generates corresponding '.d.ts' file. */
- // "declarationMap": true, /* Generates a sourcemap for each corresponding '.d.ts' file. */
- // "sourceMap": true, /* Generates corresponding '.map' file. */
+ "declaration": true /* Generates corresponding '.d.ts' file. */,
+ "declarationMap": true /* Generates a sourcemap for each corresponding '.d.ts' file. */,
+ "sourceMap": true /* Generates corresponding '.map' file. */,
// "outFile": "./", /* Concatenate and emit output to single file. */
"outDir": "./dist" /* Redirect output structure to the directory. */,
// "rootDir": "./", /* Specify the root directory of input files. Use to control the output directory structure with --outDir. */