fix(ui): a card's Play clears its hover row at a large text size; Downloads links and the player description
At text size 1.3 a 242px feed thumbnail put the 63px Play 13px into the hover row (the Play grows with the root font, the picture's height does not). A picture narrower than 14rem centres the Play and the resume pair above the row; the picture box is a size container for it. The Downloads title and channel links were 21px tall inline boxes; they stand on a 24px line now (B1). The player's description says a failed load, with a retry, instead of 'No description' (both the side panel and the popover).
This commit is contained in:
@@ -9,7 +9,7 @@
|
||||
// test that leaves `window.YT` unset). Each item the modal plays constructs a new YT.Player, and the
|
||||
// fake records what it was asked for — that is how these tests see where playback starts.
|
||||
import { describe, it, expect, vi, afterEach, beforeAll, beforeEach } from "vitest";
|
||||
import { render, screen, fireEvent, waitFor, cleanup, act } from "@testing-library/react";
|
||||
import { render, screen, fireEvent, waitFor, cleanup, act, within } from "@testing-library/react";
|
||||
import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
|
||||
import type { ReactNode } from "react";
|
||||
|
||||
@@ -542,6 +542,27 @@ describe("PlayerModal — the side panel on a wide window", () => {
|
||||
expect(spin(document.querySelector(".player-stage")!, 100)).toBe(true); // over the video
|
||||
});
|
||||
|
||||
// E31 S5: a failed load read "No description." in the always-open panel — an error drawn as empty.
|
||||
it("says the description failed to load, with a retry, instead of 'No description'", async () => {
|
||||
wideWindow(true);
|
||||
const detail = vi
|
||||
.spyOn(api, "videoDetail")
|
||||
.mockRejectedValueOnce(new Error("boom"))
|
||||
.mockResolvedValue({ description: "A long description" } as Awaited<
|
||||
ReturnType<typeof api.videoDetail>
|
||||
>);
|
||||
const A = vid("A", 0);
|
||||
renderModal(
|
||||
<PlayerModal video={A} queue={[A]} startIndex={0} onClose={() => {}} onState={() => {}} />,
|
||||
);
|
||||
const panel = screen.getByTestId("player-description");
|
||||
expect(await within(panel).findByText("player.descriptionFailed")).toBeTruthy();
|
||||
expect(within(panel).queryByText("player.noDescription")).toBeNull();
|
||||
fireEvent.click(within(panel).getByRole("button", { name: "common.retry" }));
|
||||
expect(await within(panel).findByText("A long description")).toBeTruthy();
|
||||
expect(detail).toHaveBeenCalledTimes(2);
|
||||
});
|
||||
|
||||
it("keeps the details under the video below 1280 px", () => {
|
||||
wideWindow(false);
|
||||
vi.spyOn(api, "videoDetail").mockReturnValue(new Promise(() => {}));
|
||||
|
||||
Reference in New Issue
Block a user