Skip to content

Commit

Permalink
test: adapt tooltip text checks (#549)
Browse files Browse the repository at this point in the history
# Motivation

Svelte v5 appears to add `<!---->` comments in the DOM when rendering
deprecated `slot` elements. As a result, the tooltip tests that read
HTML to compare text would not be compatible.

# Notes

Related to PR #548.

# Changes

- Replace usage of `innerHTML` to compare text in the `Tooltip` test
with `textContent`.
  • Loading branch information
peterpeterparker authored Dec 10, 2024
1 parent 16cd68d commit be3f9ad
Showing 1 changed file with 7 additions and 3 deletions.
10 changes: 7 additions & 3 deletions src/tests/lib/components/Tooltip.spec.ts
Original file line number Diff line number Diff line change
Expand Up @@ -33,7 +33,7 @@ describe("Tooltip", () => {
const tooltipElement = baseElement.querySelector(".tooltip");
expect(tooltipElement).toBeInTheDocument();
expect(tooltipElement?.classList).not.toContain("not-rendered");
expect(tooltipElement?.innerHTML).toBe("text");
expect(tooltipElement?.textContent).toBe("text");
});

it("should render tooltip slot content", () => {
Expand All @@ -42,9 +42,13 @@ describe("Tooltip", () => {
const tooltipElement = baseElement.querySelector(".tooltip");
expect(tooltipElement).toBeInTheDocument();
expect(tooltipElement?.classList).not.toContain("not-rendered");
expect(tooltipElement?.innerHTML).toBe(
'<div slot="tooltip-content">slot text</div>',

const tooltipSlot = tooltipElement?.querySelector(
"[slot='tooltip-content']",
);
expect(tooltipSlot).toBeInTheDocument();
expect(tooltipSlot?.nodeName.toLowerCase()).toEqual("div");
expect(tooltipSlot?.textContent).toBe("slot text");
});

it("should render aria-describedby and relevant id", () => {
Expand Down

0 comments on commit be3f9ad

Please sign in to comment.