Merge branch 'arc-themes-release-version-2.1.0' into dependabot/npm_a…

…nd_yarn/blocks/article-body-block/postcss-8.4.31

.github/workflows/security-scan.yml

@@ -36,4 +36,4 @@ jobs:
           languages: ${{ matrix.language }}
 
       - name: Perform CodeQL Analysis
-        uses: github/codeql-action/analyze@v1
+        uses: github/codeql-action/analyze@v2

.github/workflows/stylelint-pr.yml

@@ -13,7 +13,7 @@ jobs:
     runs-on: ubuntu-latest
     steps:
       - name: Checkout Rep
-        uses: actions/checkout@v1
+        uses: actions/checkout@v3
 
       - name: Setup Node
         uses: actions/setup-node@v3

.github/workflows/sync-themes-branch-with-themes-tag.yml

@@ -51,8 +51,8 @@ jobs:
         env:
           NODE_AUTH_TOKEN: ${{ secrets.GITHUB_TOKEN }}
 
-      - name: Run all tests
-        run: npm run test
+      #- name: Run all tests
+      #  run: npm run test
 
       # See confluence pages https://arcpublishing.atlassian.net/wiki/spaces/TI/pages/2983788608/How+To+Do+Product-Facing+Tag+Release and https://arcpublishing.atlassian.net/wiki/spaces/TI/pages/3013541978/Github+Actions+for+NodeJS+Standards+Best+Practices for documentation
       - name: Publish to target tag based off of branch name

.husky/pre-commit

@@ -1,4 +1,4 @@
 #!/bin/sh
 . "$(dirname "$0")/_/husky.sh"
 
-npx lint-staged
+# npx lint-staged

.husky/pre-push

@@ -1,4 +1,5 @@
 #!/bin/sh
 . "$(dirname "$0")/_/husky.sh"
+
 # fetching latest changes `git fetch -a --depth 100` to ensure the base branch is up to date
-git fetch -a --depth 100 && npm run lint:changed-feature-branch && npm run test:changed-feature-branch
+# git fetch -a --depth 100 && npm run lint:changed-feature-branch && npm run test:changed-feature-branch

.nvmrc

@@ -1 +1 @@
-14
+20

blocks/ads-block/features/ads/_children/AdUnit/index.test.jsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { mount } from "enzyme";
+import { render } from "@testing-library/react";
 import AdUnit from "./index";
 import ArcAdsInstance from "../ArcAdsInstance";
 import { setPageTargeting } from "../../ad-helper";
@@ -79,11 +79,12 @@ describe("<AdUnit/>", () => {
 	});
 
 	it("renders and registers ad unit on published page", () => {
-		const wrapper = mount(<AdUnit adConfig={AD_CONFIG_MOCK} featureConfig={FEATURE_CONFIG_MOCK} />);
-		expect(wrapper).toBeDefined();
+		const { container } = render(
+			<AdUnit adConfig={AD_CONFIG_MOCK} featureConfig={FEATURE_CONFIG_MOCK} />
+		);
 		// id with the ad config
-		const adUnitEl = wrapper.find(`#${AD_CONFIG_MOCK_ID}`);
-		expect(adUnitEl).toHaveLength(1);
+		const adUnitEl = container.querySelector(`#${AD_CONFIG_MOCK_ID}`);
+		expect(adUnitEl).not.toBeNull();
 
 		expect(ArcAdsInstance.getInstance).toHaveBeenCalledTimes(1);
 		expect(setPageTargeting).toBeCalledWith(expect.objectContaining(FEATURE_CONFIG_MOCK));

blocks/ads-block/features/ads/_children/ArcAdminAd/index.test.jsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { mount } from "enzyme";
+import { render, screen } from "@testing-library/react";
 import ArcAdminAd from "./index";
 
 const defaults = {
@@ -17,26 +17,16 @@ const defaults = {
 
 describe("<ArcAdminAd>", () => {
 	it("renders with ad name", () => {
-		const wrapper = mount(<ArcAdminAd {...defaults.props} />);
-		expect(wrapper).toBeDefined();
-		const container = wrapper.find("div.b-ads-block--admin");
-		expect(container).toHaveLength(1);
-		const adNameEl = container.find("p").at(0);
-		expect(adNameEl).toHaveLength(1);
-		expect(adNameEl.text()).toEqual("test-ad-name");
+		render(<ArcAdminAd {...defaults.props} />);
+		expect(screen.getByText("test-ad-name")).not.toBeNull();
 	});
 
 	it("renders with default ad name", () => {
 		const adProps = {
 			...defaults.props,
 			adType: undefined,
 		};
-		const wrapper = mount(<ArcAdminAd {...adProps} />);
-		expect(wrapper).toBeDefined();
-		const container = wrapper.find("div.b-ads-block--admin");
-		expect(container).toHaveLength(1);
-		const adNameEl = container.find("p").at(0);
-
-		expect(adNameEl.text()).toEqual("Ad Name N/A");
+		render(<ArcAdminAd {...adProps} />);
+		expect(screen.getByText("Ad Name N/A")).not.toBeNull();
 	});
 });

blocks/ads-block/features/ads/ad-helper.test.js

@@ -212,7 +212,7 @@ describe("ad-helper", () => {
 	});
 
 	describe("getTags()", () => {
-		it('returns empty string with invalid "globalContent"', () => {
+		it("returns empty string with invalid 'globalContent'", () => {
 			const tags = getTags();
 			expect(tags).toBeDefined();
 			expect(tags).toBe("");
@@ -224,6 +224,17 @@ describe("ad-helper", () => {
 				expect(tags).toContain(tag.slug);
 			});
 		});
+		it("returns empty sting when tags are empty", () => {
+			const tags = getTags({
+				globalContent: {
+					taxonomy: {
+						tags: [{}, {}],
+					},
+				},
+			});
+			expect(tags).toBeDefined();
+			expect(tags).toBe("");
+		});
 	});
 
 	describe("getPageType()", () => {

blocks/ads-block/features/ads/default.jsx

@@ -42,7 +42,7 @@ export const ArcAdDisplay = (props) => {
 						offsetLeft={0}
 						offsetRight={0}
 						offsetTop={200}
-						renderPlaceholder={(ref) => <div ref={ref} />}
+						renderPlaceholder={(ref) => <div data-testid="lazy-load-placeholder" ref={ref} />}
 					>
 						<AdUnit adConfig={config} featureConfig={propsWithContext} />
 					</LazyLoad>

blocks/ads-block/features/ads/default.test.jsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { useFusionContext } from "fusion:context";
-import { mount } from "enzyme";
+import { render, screen } from "@testing-library/react";
 import ArcAd from "./default";
 
 jest.mock("@wpmedia/arc-themes-components", () => ({
@@ -45,14 +45,9 @@ describe("<ArcAd>", () => {
 		});
 
 		it("renders no ad unit in admin dashboard", () => {
-			const wrapper = mount(<ArcAd {...AD_PROPS_MOCK} />);
-			expect(wrapper).toBeDefined();
-			const arcAdminAd = wrapper.find("ArcAdminAd");
-			expect(arcAdminAd.prop("adClass")).toEqual(AD_PROPS_MOCK.customFields.adType);
-			expect(arcAdminAd.prop("adType")).toEqual("cube");
-			expect(arcAdminAd.prop("slotName")).toEqual("news");
-			expect(typeof arcAdminAd.prop("dimensions")).toEqual("object");
-			expect(wrapper.find("AdUnit")).toHaveLength(0);
+			render(<ArcAd {...AD_PROPS_MOCK} />);
+			expect(screen.getByText("cube")).not.toBeNull();
+			expect(screen.queryByText(/ads-block.ad-label/)).toBeNull();
 		});
 	});
 
@@ -67,15 +62,8 @@ describe("<ArcAd>", () => {
 
 		describe("when lazy loading is disabled", () => {
 			it("renders ad unit with disabled lazy-load container", () => {
-				const wrapper = mount(<ArcAd {...AD_PROPS_MOCK} />);
-				expect(wrapper).toBeDefined();
-				const lazyLoaderEl = wrapper.find("LazyLoad");
-				expect(lazyLoaderEl).toHaveLength(1);
-				expect(lazyLoaderEl.prop("enabled")).toBe(false);
-				const adUnitEl = lazyLoaderEl.find("AdUnit");
-				expect(adUnitEl).toHaveLength(1);
-				expect(typeof adUnitEl.prop("adConfig")).toEqual("object");
-				expect(typeof adUnitEl.prop("featureConfig")).toEqual("object");
+				render(<ArcAd {...AD_PROPS_MOCK} />);
+				expect(screen.getByText(/ads-block.ad-label/)).not.toBeNull();
 			});
 		});
 
@@ -87,58 +75,49 @@ describe("<ArcAd>", () => {
 						lazyLoad: true,
 					},
 				};
-				const wrapper = mount(<ArcAd {...adProps} />);
-				expect(wrapper).toBeDefined();
-				const lazyLoaderEl = wrapper.find("LazyLoad");
-				expect(lazyLoaderEl).toHaveLength(1);
-				expect(lazyLoaderEl.prop("enabled")).toBe(true);
+				render(<ArcAd {...adProps} />);
+				expect(screen.getByTestId("lazy-load-placeholder")).not.toBeNull();
 			});
 		});
-	});
 
-	describe("Reserve Space", () => {
-		it("renders with width only", () => {
-			const adProps = {
-				...AD_PROPS_MOCK,
-				customFields: {
-					reserveSpace: false,
-				},
-			};
-			const wrapper = mount(<ArcAd {...adProps} />);
-			const adContainer = wrapper.find("div.b-ads-block > div");
-			expect(adContainer).toHaveLength(1);
-			expect(adContainer.prop("style").maxWidth).toBeDefined();
-			expect(adContainer.prop("style").minHeight).toBe(null);
-		});
+		describe("Reserve Space", () => {
+			it("renders with width only", () => {
+				const adProps = {
+					...AD_PROPS_MOCK,
+					customFields: {
+						reserveSpace: false,
+					},
+				};
+				const { container } = render(<ArcAd {...adProps} />);
+				const adContainer = container.querySelector("div.b-ads-block > div");
+				expect(adContainer.style.maxWidth).not.toBe("");
+				expect(adContainer.style.minHeight).toBe("");
+			});
 
-		it("renders with height and width", () => {
-			const wrapper = mount(<ArcAd {...AD_PROPS_MOCK} />);
-			const adContainer = wrapper.find("div.b-ads-block > div");
-			expect(adContainer).toHaveLength(1);
-			expect(adContainer.prop("style").maxWidth).toBeDefined();
-			expect(adContainer.prop("style").minHeight).not.toBe(null);
+			it("renders with height and width", () => {
+				const { container } = render(<ArcAd {...AD_PROPS_MOCK} />);
+				const adContainer = container.querySelector("div.b-ads-block > div");
+				expect(adContainer.style.maxWidth).not.toBe("");
+				expect(adContainer.style.minHeight).not.toBe("");
+			});
 		});
-	});
 
-	describe("Advertisement Label", () => {
-		it("renders no advertisement label when disabled", () => {
-			const adProps = {
-				...AD_PROPS_MOCK,
-				customFields: {
-					displayAdLabel: false,
-				},
-			};
-			const wrapper = mount(<ArcAd {...adProps} />);
-			const container = wrapper.find("div.b-ads-block");
-			expect(container).toHaveLength(1);
-			expect(container.text()).toEqual("");
-		});
+		describe("Advertisement Label", () => {
+			it("renders no advertisement label when disabled", () => {
+				const adProps = {
+					...AD_PROPS_MOCK,
+					customFields: {
+						displayAdLabel: false,
+					},
+				};
+				render(<ArcAd {...adProps} />);
+				expect(screen.queryByText(/ads-block.ad-label/)).toBeNull();
+			});
 
-		it("renders advertisement label when enabled", () => {
-			const wrapper = mount(<ArcAd {...AD_PROPS_MOCK} />);
-			const container = wrapper.find("div.b-ads-block");
-			expect(container).toHaveLength(1);
-			expect(container.text()).toEqual("ads-block.ad-label");
+			it("renders advertisement label when enabled", () => {
+				render(<ArcAd {...AD_PROPS_MOCK} />);
+				expect(screen.getByText(/ads-block.ad-label/)).not.toBeNull();
+			});
 		});
 	});
 });

blocks/ads-block/package.json

@@ -22,7 +22,7 @@
     "directory": "blocks/ads-block"
   },
   "dependencies": {
-    "arcads": "6.1.1"
+    "arcads": "6.2.0"
   },
   "peerDependencies": {
     "@arc-fusion/prop-types": "^0.1.5",

blocks/alert-bar-block/package.json

@@ -26,7 +26,7 @@
 		"@wpmedia/arc-themes-components": "*"
 	},
 	"dependencies": {
-		"cookie": "^0.4.1"
+		"cookie": "^0.5.0"
 	},
 	"gitHead": "83fb8d6685958d85ddbfcfbf01d9a5c864cd6c95"
 }

blocks/alert-bar-content-source-block/package.json

@@ -19,7 +19,7 @@
 		"directory": "blocks/alert-bar-content-source-block"
 	},
 	"dependencies": {
-		"axios": "^1.3.5"
+		"axios": "^1.5.1"
 	},
 	"gitHead": "83fb8d6685958d85ddbfcfbf01d9a5c864cd6c95"
 }

blocks/algolia-assortment-content-source-block/package.json

@@ -18,6 +18,6 @@
     "directory": "blocks/algolia-assortment-content-source-block"
   },
   "dependencies": {
-    "algoliasearch": "^4.13.0"
+    "algoliasearch": "^4.20.0"
   }
 }

blocks/article-body-block/package.json

@@ -26,8 +26,8 @@
     "@wpmedia/arc-themes-components": "*"
   },
   "dependencies": {
-    "react-oembed-container": "^1.0.0",
-    "sanitize-html": "^2.9.0"
+    "react-oembed-container": "^1.0.1",
+    "sanitize-html": "^2.11.0"
   },
   "gitHead": "83fb8d6685958d85ddbfcfbf01d9a5c864cd6c95"
 }

blocks/author-content-source-block/package.json

@@ -19,7 +19,7 @@
 		"directory": "blocks/author-content-source-block"
 	},
 	"dependencies": {
-		"axios": "^1.3.5"
+		"axios": "^1.5.1"
 	},
 	"peerDependencies": {
 		"@wpmedia/arc-themes-components": "*",

blocks/collections-content-source-block/package.json

@@ -19,7 +19,7 @@
 		"directory": "blocks/collections-content-source-block"
 	},
 	"dependencies": {
-		"axios": "^1.3.5"
+		"axios": "^1.5.1"
 	},
 	"peerDependencies": {
 		"@wpmedia/arc-themes-components": "*",

blocks/commerce-product-content-source-block/package.json

@@ -19,6 +19,6 @@
     "directory": "blocks/commerce-product-content-source-block"
   },
   "dependencies": {
-    "axios": "^1.3.5"
+    "axios": "^1.5.1"
   }
 }

blocks/content-api-source-block/package.json

@@ -19,7 +19,7 @@
 		"directory": "blocks/content-api-source-block"
 	},
 	"dependencies": {
-		"axios": "^1.3.5"
+		"axios": "^1.5.1"
 	},
 	"peerDependencies": {
 		"@wpmedia/arc-themes-components": "*",

blocks/header-nav-chain-block/package.json

@@ -26,7 +26,7 @@
     "@wpmedia/arc-themes-components": "*"
   },
   "dependencies": {
-    "focus-trap-react": "^10.1.1",
+    "focus-trap-react": "^10.2.3",
     "use-debounce": "^9.0.4"
   },
   "gitHead": "83fb8d6685958d85ddbfcfbf01d9a5c864cd6c95"