diff --git a/js/ui/components/VideoModal.js b/js/ui/components/VideoModal.js index a48758a9..c693e176 100644 --- a/js/ui/components/VideoModal.js +++ b/js/ui/components/VideoModal.js @@ -2997,8 +2997,12 @@ export class VideoModal { this.dispatch("action:copy", { video: this.activeVideo }); } - handleShareRequest() { - this.dispatch("action:share", { video: this.activeVideo }); + handleShareRequest(event) { + if (this.modalSharePopover) { + this.modalSharePopover.toggle(); + } else { + this.dispatch("action:share", { video: this.activeVideo }); + } } handleEmbedRequest() { @@ -3249,9 +3253,9 @@ export class VideoModal { this.modalMorePopover.destroy(); } - this.modalMorePopover = createPopover({ - trigger: this.modalMoreBtn, - content: (container) => { + this.modalMorePopover = createPopover( + this.modalMoreBtn, + ({ container }) => { if (!this.activeVideo) { container.innerHTML = ""; return; @@ -3269,18 +3273,21 @@ export class VideoModal { container.appendChild(panel); this.modalMoreMenuPanel = panel; } + return panel; }, - placement: "bottom-end", - offset: 8, - onOpen: () => { - if (this.activeVideo) { - this.syncMoreMenuData({ - currentVideo: this.activeVideo, - canManageBlacklist: this.modalMoreMenuContext.canManageBlacklist, - }); - } - }, - }); + { + placement: "bottom-end", + offset: 8, + onOpen: () => { + if (this.activeVideo) { + this.syncMoreMenuData({ + currentVideo: this.activeVideo, + canManageBlacklist: this.modalMoreMenuContext.canManageBlacklist, + }); + } + }, + } + ); } setupModalSharePopover() { @@ -3298,9 +3305,9 @@ export class VideoModal { this.modalSharePopover.destroy(); } - this.modalSharePopover = createPopover({ - trigger: this.shareBtn, - content: (container) => { + this.modalSharePopover = createPopover( + this.shareBtn, + ({ container }) => { if (!this.activeVideo) { container.innerHTML = ""; return; @@ -3316,10 +3323,14 @@ export class VideoModal { if (panel) { container.appendChild(panel); } + return panel; }, - placement: "top", // or "top-start" based on layout - offset: 8, - }); + { + placement: "top", // or "top-start" based on layout + offset: 8, + document: this.document, + } + ); } refreshModalMoreMenuPanel() { diff --git a/tests/e2e/search-and-filter.spec.ts b/tests/e2e/search-and-filter.spec.ts index be4eab67..fdd0643d 100644 --- a/tests/e2e/search-and-filter.spec.ts +++ b/tests/e2e/search-and-filter.spec.ts @@ -75,7 +75,7 @@ test.describe("Search and filtering", () => { // Wait for all videos to load await page.evaluate(() => { - return (window as any).__bitvidTest__.waitForFeedItems(3, 20000); + return (window as any).__bitvidTest__.waitForFeedItems(3, 30000); }); // When: user searches for "Cooking" @@ -118,7 +118,7 @@ test.describe("Search and filtering", () => { await loginAs(page); await page.evaluate(() => { - return (window as any).__bitvidTest__.waitForFeedItems(1, 15000); + return (window as any).__bitvidTest__.waitForFeedItems(1, 30000); }); // When: user searches for something that doesn't match @@ -154,7 +154,7 @@ test.describe("Search and filtering", () => { await loginAs(page); await page.evaluate(() => { - return (window as any).__bitvidTest__.waitForFeedItems(1, 15000); + return (window as any).__bitvidTest__.waitForFeedItems(1, 30000); }); const searchInput = page.locator('[data-testid="search-input"]'); diff --git a/tests/e2e/video-modal-share-bug.spec.ts b/tests/e2e/video-modal-share-bug.spec.ts index b738f8ce..7ff8cd13 100644 --- a/tests/e2e/video-modal-share-bug.spec.ts +++ b/tests/e2e/video-modal-share-bug.spec.ts @@ -30,19 +30,23 @@ test.describe("video modal share button", () => { // Force loaded state and hydrate const playerModal = document.getElementById("playerModal"); if (playerModal) { + videoModal.document = document; videoModal.loaded = true; videoModal.hydrate(playerModal); // Mock an active video so the share menu has data - videoModal.activeVideo = { + const activeVideo = { id: "test-video-id", title: "Test Video", url: "https://example.com/video.mp4", magnet: "magnet:?xt=urn:btih:test", }; + videoModal.shareNostrAuthState = { isLoggedIn: true, hasSigner: true }; + // Open the modal - videoModal.open(videoModal.activeVideo); + videoModal.open(activeVideo); + videoModal.setShareEnabled(true); } window.__videoModal = videoModal; @@ -53,9 +57,10 @@ test.describe("video modal share button", () => { const modal = page.locator("#playerModal"); await expect(modal).not.toHaveClass(/hidden/); - // Click share button + // Ensure modal is visible and click share button const shareBtn = page.locator("#shareBtn"); await expect(shareBtn).toBeVisible(); + await shareBtn.click(); // Expect popover to be open