- {author?.image ? (
-
-
-
- ) : null}
+
{author?.byline || author?.role || bio || socials.length ? (
diff --git a/blocks/full-author-bio-block/features/full-author-bio/_children/Presentation/index.test.jsx b/blocks/full-author-bio-block/features/full-author-bio/_children/Presentation/index.test.jsx
index 6654ee01b4..1efabc1af0 100644
--- a/blocks/full-author-bio-block/features/full-author-bio/_children/Presentation/index.test.jsx
+++ b/blocks/full-author-bio-block/features/full-author-bio/_children/Presentation/index.test.jsx
@@ -1,5 +1,6 @@
import React from "react";
import { render, screen } from "@testing-library/react";
+import "@testing-library/jest-dom";
import Presentation from ".";
@@ -9,11 +10,25 @@ jest.mock("@wpmedia/arc-themes-components", () => ({
}));
describe("Full Author Bio Block", () => {
+ beforeEach(() => {
+ jest.spyOn(console, "error").mockImplementation((message) =>
+ message === "No auth token provided for resizer"
+ ? null
+ : // eslint-disable-next-line no-console
+ console.warn("Error Thrown:", message),
+ );
+ });
+
+ afterEach(() => {
+ // eslint-disable-next-line no-console
+ console.error.mockRestore();
+ });
+
it("should not render if the author is invalid", () => {
const author = undefined;
const { container } = render();
- expect(container.firstChild).toBeNull();
+ expect(container).toBeEmptyDOMElement();
});
it("should render the author url if the authorProfileLink if true", () => {
@@ -22,9 +37,9 @@ describe("Full Author Bio Block", () => {
byline: "Jane Da Doe",
};
render(
-
+ ,
);
- const link = screen.queryByRole("link", { name: author.byline });
+ const link = screen.getByRole("link", { name: author.byline });
expect(link).not.toBeNull();
expect(link.href).toBe("http://localhost/author/profile");
});
@@ -35,7 +50,7 @@ describe("Full Author Bio Block", () => {
byline: "Jane Da Doe",
};
render();
- expect(screen.queryByRole("heading", { name: author.byline })).not.toBeNull();
+ expect(screen.getByRole("heading", { name: author.byline })).not.toBeNull();
});
it("should render the role", () => {
@@ -44,7 +59,7 @@ describe("Full Author Bio Block", () => {
role: "Senior Product Manager",
};
render();
- expect(screen.queryByRole("heading", { name: author.role })).not.toBeNull();
+ expect(screen.getByRole("heading", { name: author.role })).not.toBeNull();
});
it("should render the long bio", () => {
@@ -53,7 +68,7 @@ describe("Full Author Bio Block", () => {
longBio: "Jane Doe is a senior product manager for Arc Publishing. \nShe works on Arc Themes",
};
render();
- expect(screen.queryByText("She works on Arc Themes", { exact: false })).not.toBeNull();
+ expect(screen.getByText("She works on Arc Themes", { exact: false })).not.toBeNull();
});
it("should render the photo with byline alt text", () => {
@@ -61,20 +76,47 @@ describe("Full Author Bio Block", () => {
_id: "janedoe",
byline: "Jane Da Doe",
image: "image.jpg",
- resized_params: { "158x158": "" },
};
render();
- expect(screen.queryByRole("img", { name: author.byline })).not.toBeNull();
+ expect(screen.getByRole("img", { name: author.byline })).not.toBeNull();
});
it("should render the photo without byline as blank alt text", () => {
const author = {
_id: "janedoe",
image: "img.jpg",
- resized_params: { "158x158": "" },
};
render();
- expect(screen.queryByRole("img", { name: "" })).not.toBeNull();
+ expect(screen.getByRole("img", { name: "" })).not.toBeNull();
+ });
+
+ it("should render the resized photo if resizer information is available", () => {
+ const author = {
+ _id: "janedoe",
+ image: "img.jpg",
+ byline: "resized image",
+ ansImage: {
+ url: "resized.jpg",
+ auth: { 2: "12345" },
+ },
+ };
+ render();
+ const image = screen.getByRole("img", {
+ name: "resized image",
+ });
+ expect(image?.src).toBe(
+ "http://url.com/resized.jpg?smart=true&auth=12345&width=180&height=180",
+ );
+ const imageSrcSet = new Set(image?.srcset?.split(", "));
+ expect(imageSrcSet).toContain(
+ "http://url.com/resized.jpg?smart=true&auth=12345&width=180&height=180 180w",
+ );
+ expect(imageSrcSet).toContain(
+ "http://url.com/resized.jpg?smart=true&auth=12345&width=360&height=360 360w",
+ );
+ expect(imageSrcSet).toContain(
+ "http://url.com/resized.jpg?smart=true&auth=12345&width=720&height=720 720w",
+ );
});
it("should render the all the supported icons if specified", () => {
@@ -96,20 +138,20 @@ describe("Full Author Bio Block", () => {
youtube: "janedoe",
};
render();
- expect(screen.queryByTestId("Envelope")).not.toBeNull();
- expect(screen.queryByTestId("Facebook")).not.toBeNull();
- expect(screen.queryByTestId("Instagram")).not.toBeNull();
- expect(screen.queryByTestId("LinkedIn")).not.toBeNull();
- expect(screen.queryByTestId("Medium")).not.toBeNull();
- expect(screen.queryByTestId("Pinterest")).not.toBeNull();
- expect(screen.queryByTestId("Reddit")).not.toBeNull();
- expect(screen.queryByTestId("Rss")).not.toBeNull();
- expect(screen.queryByTestId("Snapchat")).not.toBeNull();
- expect(screen.queryByTestId("SoundCloud")).not.toBeNull();
- expect(screen.queryByTestId("Tumblr")).not.toBeNull();
- expect(screen.queryByTestId("Twitter")).not.toBeNull();
- expect(screen.queryByTestId("WhatsApp")).not.toBeNull();
- expect(screen.queryByTestId("Youtube")).not.toBeNull();
+ expect(screen.getByTestId("Envelope")).not.toBeNull();
+ expect(screen.getByTestId("Facebook")).not.toBeNull();
+ expect(screen.getByTestId("Instagram")).not.toBeNull();
+ expect(screen.getByTestId("LinkedIn")).not.toBeNull();
+ expect(screen.getByTestId("Medium")).not.toBeNull();
+ expect(screen.getByTestId("Pinterest")).not.toBeNull();
+ expect(screen.getByTestId("Reddit")).not.toBeNull();
+ expect(screen.getByTestId("Rss")).not.toBeNull();
+ expect(screen.getByTestId("Snapchat")).not.toBeNull();
+ expect(screen.getByTestId("SoundCloud")).not.toBeNull();
+ expect(screen.getByTestId("Tumblr")).not.toBeNull();
+ expect(screen.getByTestId("Twitter")).not.toBeNull();
+ expect(screen.getByTestId("WhatsApp")).not.toBeNull();
+ expect(screen.getByTestId("Youtube")).not.toBeNull();
});
it("should not render the missing supported icon (twitter) if missing from author", () => {
@@ -130,20 +172,20 @@ describe("Full Author Bio Block", () => {
youtube: "janedoe",
};
render();
- expect(screen.queryByTestId("Envelope")).not.toBeNull();
- expect(screen.queryByTestId("Facebook")).not.toBeNull();
- expect(screen.queryByTestId("Instagram")).not.toBeNull();
- expect(screen.queryByTestId("LinkedIn")).not.toBeNull();
- expect(screen.queryByTestId("Medium")).not.toBeNull();
- expect(screen.queryByTestId("Pinterest")).not.toBeNull();
- expect(screen.queryByTestId("Reddit")).not.toBeNull();
- expect(screen.queryByTestId("Rss")).not.toBeNull();
- expect(screen.queryByTestId("Snapchat")).not.toBeNull();
- expect(screen.queryByTestId("SoundCloud")).not.toBeNull();
- expect(screen.queryByTestId("Tumblr")).not.toBeNull();
+ expect(screen.getByTestId("Envelope")).not.toBeNull();
+ expect(screen.getByTestId("Facebook")).not.toBeNull();
+ expect(screen.getByTestId("Instagram")).not.toBeNull();
+ expect(screen.getByTestId("LinkedIn")).not.toBeNull();
+ expect(screen.getByTestId("Medium")).not.toBeNull();
+ expect(screen.getByTestId("Pinterest")).not.toBeNull();
+ expect(screen.getByTestId("Reddit")).not.toBeNull();
+ expect(screen.getByTestId("Rss")).not.toBeNull();
+ expect(screen.getByTestId("Snapchat")).not.toBeNull();
+ expect(screen.getByTestId("SoundCloud")).not.toBeNull();
+ expect(screen.getByTestId("Tumblr")).not.toBeNull();
expect(screen.queryByTestId("Twitter")).toBeNull();
- expect(screen.queryByTestId("WhatsApp")).not.toBeNull();
- expect(screen.queryByTestId("Youtube")).not.toBeNull();
+ expect(screen.getByTestId("WhatsApp")).not.toBeNull();
+ expect(screen.getByTestId("Youtube")).not.toBeNull();
});
it("should render the email icon if specified", () => {
@@ -152,7 +194,7 @@ describe("Full Author Bio Block", () => {
email: "janedoe",
};
render();
- expect(screen.queryByTestId("Envelope")).not.toBeNull();
+ expect(screen.getByTestId("Envelope")).not.toBeNull();
});
it("should render the Facebook icon if specified", () => {
@@ -161,7 +203,7 @@ describe("Full Author Bio Block", () => {
facebook: "janedoe",
};
render();
- expect(screen.queryByTestId("Facebook")).not.toBeNull();
+ expect(screen.getByTestId("Facebook")).not.toBeNull();
});
it("should render the Instagram icon if specified", () => {
@@ -170,7 +212,7 @@ describe("Full Author Bio Block", () => {
instagram: "janedoe",
};
render();
- expect(screen.queryByTestId("Instagram")).not.toBeNull();
+ expect(screen.getByTestId("Instagram")).not.toBeNull();
});
it("should render the LinkedIn icon if specified", () => {
@@ -179,7 +221,7 @@ describe("Full Author Bio Block", () => {
linkedin: "janedoe",
};
render();
- expect(screen.queryByTestId("LinkedIn")).not.toBeNull();
+ expect(screen.getByTestId("LinkedIn")).not.toBeNull();
});
it("should render the RSS icon if specified", () => {
@@ -188,7 +230,7 @@ describe("Full Author Bio Block", () => {
rss: "janedoe",
};
render();
- expect(screen.queryByTestId("Rss")).not.toBeNull();
+ expect(screen.getByTestId("Rss")).not.toBeNull();
});
it("should render the Twitter icon if specified", () => {
@@ -197,7 +239,7 @@ describe("Full Author Bio Block", () => {
twitter: "janedoe",
};
render();
- expect(screen.queryByTestId("Twitter")).not.toBeNull();
+ expect(screen.getByTestId("Twitter")).not.toBeNull();
});
it("should render the Medium icon if specified", () => {
@@ -206,7 +248,7 @@ describe("Full Author Bio Block", () => {
medium: "janedoe",
};
render();
- expect(screen.queryByTestId("Medium")).not.toBeNull();
+ expect(screen.getByTestId("Medium")).not.toBeNull();
});
it("should render the Pinterest icon if specified", () => {
@@ -215,7 +257,7 @@ describe("Full Author Bio Block", () => {
pinterest: "janedoe",
};
render();
- expect(screen.queryByTestId("Pinterest")).not.toBeNull();
+ expect(screen.getByTestId("Pinterest")).not.toBeNull();
});
it("should render the Reddit icon if specified", () => {
@@ -224,7 +266,7 @@ describe("Full Author Bio Block", () => {
reddit: "janedoe",
};
render();
- expect(screen.queryByTestId("Reddit")).not.toBeNull();
+ expect(screen.getByTestId("Reddit")).not.toBeNull();
});
it("should render the Snapchat icon if specified", () => {
@@ -233,7 +275,7 @@ describe("Full Author Bio Block", () => {
snapchat: "janedoe",
};
render();
- expect(screen.queryByTestId("Snapchat")).not.toBeNull();
+ expect(screen.getByTestId("Snapchat")).not.toBeNull();
});
it("should render the SoundCloud icon if specified", () => {
@@ -242,7 +284,7 @@ describe("Full Author Bio Block", () => {
soundcloud: "janedoe",
};
render();
- expect(screen.queryByTestId("SoundCloud")).not.toBeNull();
+ expect(screen.getByTestId("SoundCloud")).not.toBeNull();
});
it("should render the Tumblr icon if specified", () => {
@@ -251,7 +293,7 @@ describe("Full Author Bio Block", () => {
tumblr: "janedoe",
};
render();
- expect(screen.queryByTestId("Tumblr")).not.toBeNull();
+ expect(screen.getByTestId("Tumblr")).not.toBeNull();
});
it("should render the WhatsApp icon if specified", () => {
@@ -260,7 +302,7 @@ describe("Full Author Bio Block", () => {
whatsapp: "janedoe",
};
render();
- expect(screen.queryByTestId("WhatsApp")).not.toBeNull();
+ expect(screen.getByTestId("WhatsApp")).not.toBeNull();
});
it("should render the Youtube icon if specified", () => {
@@ -269,6 +311,6 @@ describe("Full Author Bio Block", () => {
youtube: "janedoe",
};
render();
- expect(screen.queryByTestId("Youtube")).not.toBeNull();
+ expect(screen.getByTestId("Youtube")).not.toBeNull();
});
});
diff --git a/blocks/full-author-bio-block/features/full-author-bio/default.test.jsx b/blocks/full-author-bio-block/features/full-author-bio/default.test.jsx
index 9e3826aee6..8d88cdc4cc 100644
--- a/blocks/full-author-bio-block/features/full-author-bio/default.test.jsx
+++ b/blocks/full-author-bio-block/features/full-author-bio/default.test.jsx
@@ -1,5 +1,6 @@
import React from "react";
import { render } from "@testing-library/react";
+import "@testing-library/jest-dom";
import { useFusionContext } from "fusion:context";
import getProperties from "fusion:properties";
@@ -32,6 +33,20 @@ const authors = [
];
describe("Full author bio block", () => {
+ beforeEach(() => {
+ jest.spyOn(console, "error").mockImplementation((message) =>
+ message === "No auth token provided for resizer"
+ ? null
+ : // eslint-disable-next-line no-console
+ console.warn("Error Thrown:", message),
+ );
+ });
+
+ afterEach(() => {
+ // eslint-disable-next-line no-console
+ console.error.mockRestore();
+ });
+
describe("lazy load and isAdmin", () => {
it("should return null if lazyLoad on the server and not in the admin", () => {
useFusionContext.mockImplementation(() => ({
@@ -41,7 +56,7 @@ describe("Full author bio block", () => {
isAdmin: false,
}));
const { container } = render();
- expect(container.firstChild).toBeNull();
+ expect(container).toBeEmptyDOMElement();
});
it("should not return null if not lazyLoad on the server and isAdmin", () => {
@@ -52,7 +67,7 @@ describe("Full author bio block", () => {
isAdmin: true,
}));
const { container } = render();
- expect(container.firstChild).not.toBeNull();
+ expect(container).not.toBeEmptyDOMElement();
});
it("should not return null if lazyLoad on the server and isAdmin", () => {
@@ -63,7 +78,7 @@ describe("Full author bio block", () => {
isAdmin: true,
}));
const { container } = render();
- expect(container.firstChild).not.toBeNull();
+ expect(container).not.toBeEmptyDOMElement();
});
});
@@ -79,7 +94,7 @@ describe("Full author bio block", () => {
it("should render", () => {
const { container } = render();
- expect(container.firstChild).not.toBeNull();
+ expect(container).not.toBeEmptyDOMElement();
});
});
@@ -98,7 +113,7 @@ describe("Full author bio block", () => {
it("should still render", () => {
const { container } = render();
- expect(container.firstChild).not.toBeNull();
+ expect(container).not.toBeEmptyDOMElement();
});
});
@@ -114,7 +129,7 @@ describe("Full author bio block", () => {
it("should NOT render anything", () => {
const { container } = render();
- expect(container.firstChild).toBeNull();
+ expect(container).toBeEmptyDOMElement();
});
});
});
diff --git a/blocks/full-author-bio-block/package-lock.json b/blocks/full-author-bio-block/package-lock.json
deleted file mode 100644
index 6fa092aabf..0000000000
--- a/blocks/full-author-bio-block/package-lock.json
+++ /dev/null
@@ -1,5 +0,0 @@
-{
- "name": "@wpmedia/full-author-bio-block",
- "version": "5.19.0",
- "lockfileVersion": 1
-}