From 363f5a3f4544bc89a3df5dca3540221b9fd90134 Mon Sep 17 00:00:00 2001
From: Conor <95449364+AccessiT3ch@users.noreply.github.com>
Date: Mon, 2 Feb 2026 14:54:53 -0800
Subject: [PATCH 1/4] fix: prioritize Share API and ensure resource links open
 in new tabs

Phase 2.3 bug fixes:

Bug 1: Share API Detection
- Remove mobile/desktop distinction for Share API
- Prioritize navigator.share when available (any platform)
- Fall back to clipboard API when share not available
- Fixes Android apps incorrectly reporting no Share API

Bug 2: Resource Modal Links
- Add as="a" prop to Button components to ensure proper anchor rendering
- All resource links now correctly open in new tabs
- Fixes California Rapid Response Networks links opening in same tab

Also:
- Update all shareHandler tests to reflect new prioritization logic
- Renumber Update Strategy section from 2.3 to 2.4 in workplan
- Update workplan with Phase 2.3 bug fix details

Tests: All 234 tests passing
---
 src/Components/Header/Header.jsx           |  4 +-
 src/Components/Resources/ResourceModal.jsx |  1 +
 src/utils.error-handling.test.js           | 94 +++++++++++++---------
 src/utils.js                               | 43 +++-------
 workplan.md                                | 25 +++++-
 5 files changed, 97 insertions(+), 70 deletions(-)

diff --git a/src/Components/Header/Header.jsx b/src/Components/Header/Header.jsx
index 8d8da98..f4c3ad7 100644
--- a/src/Components/Header/Header.jsx
+++ b/src/Components/Header/Header.jsx
@@ -109,7 +109,7 @@ function Header({ title, lead, disableTranslate } = {}) {
       <Row>
         <Col style={{ textAlign: "center" }}>
           {/* Offline/Online Indicator */}
-          <div 
+          {/* <div 
             style={{ 
               position: 'absolute', 
               display: 'none',
@@ -126,7 +126,7 @@ function Header({ title, lead, disableTranslate } = {}) {
             role="status"
           >
             {online ? '🟢' : '🔴'}
-          </div>
+          </div> */}
 
           <Button
             href={
diff --git a/src/Components/Resources/ResourceModal.jsx b/src/Components/Resources/ResourceModal.jsx
index 9b180cf..8e1ae4e 100644
--- a/src/Components/Resources/ResourceModal.jsx
+++ b/src/Components/Resources/ResourceModal.jsx
@@ -36,6 +36,7 @@ function ResourceModal({ showModal, modalContent }) {
             </p>
 
             <Button
+              as="a"
               variant="primary-outline"
               href={link.url}
               target="_blank"
diff --git a/src/utils.error-handling.test.js b/src/utils.error-handling.test.js
index 205b870..4ca8388 100644
--- a/src/utils.error-handling.test.js
+++ b/src/utils.error-handling.test.js
@@ -46,31 +46,35 @@ describe("shareHandler - Error Handling", () => {
   });
 
   describe("Feature Detection", () => {
-    it("detects and uses Clipboard API on desktop", async () => {
+    it("prioritizes Share API when available (desktop with Share API)", async () => {
       await shareHandler({
         shareUrl: "https://example.com",
+        shareTitle: "Test Title",
+        shareText: "Test Text",
       });
 
-      expect(mockClipboard.writeText).toHaveBeenCalledWith("https://example.com");
-      expect(mockShare).not.toHaveBeenCalled();
-      expect(global.alert).toHaveBeenCalledWith("Link copied to clipboard");
+      expect(mockShare).toHaveBeenCalledWith({
+        title: "Test Title",
+        text: "Test Text",
+        url: "https://example.com",
+      });
+      expect(mockClipboard.writeText).not.toHaveBeenCalled();
     });
 
-    it("throws error when Clipboard API is not available on desktop", async () => {
-      // Remove clipboard API
-      Object.defineProperty(global.navigator, "clipboard", {
+    it("falls back to Clipboard API when Share API not available", async () => {
+      // Remove share API
+      Object.defineProperty(global.navigator, "share", {
         value: undefined,
         writable: true,
       });
 
-      const onError = vi.fn();
       await shareHandler({
         shareUrl: "https://example.com",
-        onError,
       });
 
-      expect(onError).toHaveBeenCalledWith("Clipboard API not supported in this browser");
-      expect(mockClipboard.writeText).not.toHaveBeenCalled();
+      expect(mockClipboard.writeText).toHaveBeenCalledWith("https://example.com");
+      expect(mockShare).not.toHaveBeenCalled();
+      expect(global.alert).toHaveBeenCalledWith("Link copied to clipboard");
     });
 
     it("uses Share API on mobile when available", async () => {
@@ -115,13 +119,7 @@ describe("shareHandler - Error Handling", () => {
       expect(global.alert).toHaveBeenCalledWith("Link copied to clipboard");
     });
 
-    it("throws error when neither Share nor Clipboard API available on mobile", async () => {
-      // Mock mobile user agent
-      Object.defineProperty(global.navigator, "userAgent", {
-        value: "Mozilla/5.0 (iPhone; CPU iPhone OS 14_0 like Mac OS X)",
-        writable: true,
-      });
-
+    it("throws error when neither Share nor Clipboard API available", async () => {
       // Remove both APIs
       Object.defineProperty(global.navigator, "share", {
         value: undefined,
@@ -175,6 +173,12 @@ describe("shareHandler - Error Handling", () => {
 
   describe("Error Handling - Permissions", () => {
     it("handles clipboard permission denied error", async () => {
+      // Remove share API to force clipboard usage
+      Object.defineProperty(global.navigator, "share", {
+        value: undefined,
+        writable: true,
+      });
+
       // Mock clipboard rejection with NotAllowedError
       const permissionError = new Error("Permission denied");
       permissionError.name = "NotAllowedError";
@@ -193,6 +197,12 @@ describe("shareHandler - Error Handling", () => {
     });
 
     it("shows alert when permission denied and no onError callback", async () => {
+      // Remove share API to force clipboard usage
+      Object.defineProperty(global.navigator, "share", {
+        value: undefined,
+        writable: true,
+      });
+
       // Mock clipboard rejection with NotAllowedError
       const permissionError = new Error("Permission denied");
       permissionError.name = "NotAllowedError";
@@ -210,6 +220,12 @@ describe("shareHandler - Error Handling", () => {
 
   describe("Error Handling - Generic Errors", () => {
     it("handles generic clipboard errors", async () => {
+      // Remove share API to force clipboard usage
+      Object.defineProperty(global.navigator, "share", {
+        value: undefined,
+        writable: true,
+      });
+
       const genericError = new Error("Network error");
       mockClipboard.writeText.mockRejectedValue(genericError);
 
@@ -224,6 +240,12 @@ describe("shareHandler - Error Handling", () => {
     });
 
     it("handles errors without message", async () => {
+      // Remove share API to force clipboard usage
+      Object.defineProperty(global.navigator, "share", {
+        value: undefined,
+        writable: true,
+      });
+
       const errorWithoutMessage = new Error();
       errorWithoutMessage.message = "";
       mockClipboard.writeText.mockRejectedValue(errorWithoutMessage);
@@ -238,6 +260,12 @@ describe("shareHandler - Error Handling", () => {
     });
 
     it("shows alert for generic errors when no onError callback", async () => {
+      // Remove share API to force clipboard usage
+      Object.defineProperty(global.navigator, "share", {
+        value: undefined,
+        writable: true,
+      });
+
       const genericError = new Error("Something went wrong");
       mockClipboard.writeText.mockRejectedValue(genericError);
 
@@ -250,15 +278,15 @@ describe("shareHandler - Error Handling", () => {
   });
 
   describe("Success Callbacks", () => {
-    it("calls onSuccess callback on desktop clipboard success", async () => {
+    it("calls onSuccess callback when Share API succeeds", async () => {
       const onSuccess = vi.fn();
       await shareHandler({
         shareUrl: "https://example.com",
         onSuccess,
       });
 
-      expect(onSuccess).toHaveBeenCalledWith("Link copied to clipboard");
-      expect(global.alert).not.toHaveBeenCalled(); // onSuccess provided, so no alert
+      expect(onSuccess).toHaveBeenCalledWith("Thanks for sharing!");
+      expect(global.console.log).not.toHaveBeenCalled(); // onSuccess provided, so no console.log
     });
 
     it("calls onSuccess callback on mobile share success", async () => {
@@ -279,14 +307,8 @@ describe("shareHandler - Error Handling", () => {
       expect(global.console.log).not.toHaveBeenCalled(); // onSuccess provided, so no console.log
     });
 
-    it("calls onSuccess callback on mobile clipboard fallback", async () => {
-      // Mock mobile user agent
-      Object.defineProperty(global.navigator, "userAgent", {
-        value: "Mozilla/5.0 (iPhone; CPU iPhone OS 14_0 like Mac OS X)",
-        writable: true,
-      });
-
-      // Remove share API
+    it("calls onSuccess callback on clipboard fallback", async () => {
+      // Remove share API to force clipboard usage
       Object.defineProperty(global.navigator, "share", {
         value: undefined,
         writable: true,
@@ -304,18 +326,18 @@ describe("shareHandler - Error Handling", () => {
   });
 
   describe("Default Behavior (No Callbacks)", () => {
-    it("shows alert on desktop success when no onSuccess callback", async () => {
+    it("logs to console when Share API succeeds and no onSuccess callback", async () => {
       await shareHandler({
         shareUrl: "https://example.com",
       });
 
-      expect(global.alert).toHaveBeenCalledWith("Link copied to clipboard");
+      expect(global.console.log).toHaveBeenCalledWith("Thanks for sharing!");
     });
 
-    it("logs to console on mobile share success when no onSuccess callback", async () => {
-      // Mock mobile user agent
-      Object.defineProperty(global.navigator, "userAgent", {
-        value: "Mozilla/5.0 (iPhone; CPU iPhone OS 14_0 like Mac OS X)",
+    it("shows alert when clipboard fallback succeeds and no onSuccess callback", async () => {
+      // Remove share API to force clipboard usage
+      Object.defineProperty(global.navigator, "share", {
+        value: undefined,
         writable: true,
       });
 
@@ -323,7 +345,7 @@ describe("shareHandler - Error Handling", () => {
         shareUrl: "https://example.com",
       });
 
-      expect(global.console.log).toHaveBeenCalledWith("Thanks for sharing!");
+      expect(global.alert).toHaveBeenCalledWith("Link copied to clipboard");
     });
   });
 });
diff --git a/src/utils.js b/src/utils.js
index 6fd1e65..464fa06 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -19,26 +19,8 @@ export async function shareHandler({
   onSuccess,
   onError,
 }) {
-  const isMobile = /iPhone|iPad|iPod|Android/i.test(navigator.userAgent);
-
   try {
-    // Desktop: Copy to clipboard
-    if (!isMobile) {
-      // Feature detection for Clipboard API
-      if (!navigator.clipboard || !navigator.clipboard.writeText) {
-        throw new Error("Clipboard API not supported in this browser");
-      }
-
-      await navigator.clipboard.writeText(shareUrl);
-      if (onSuccess) {
-        onSuccess("Link copied to clipboard");
-      } else {
-        alert("Link copied to clipboard");
-      }
-      return;
-    }
-
-    // Mobile: Use native share if available
+    // Prioritize native share API when available (works on mobile and some desktop browsers)
     if (navigator.share) {
       await navigator.share({
         title: shareTitle || document.title,
@@ -51,18 +33,19 @@ export async function shareHandler({
       } else {
         console.log("Thanks for sharing!");
       }
-    } else {
-      // Fallback to clipboard on mobile if share not available
-      if (!navigator.clipboard || !navigator.clipboard.writeText) {
-        throw new Error("Neither Share API nor Clipboard API are supported in this browser");
-      }
+      return;
+    }
 
-      await navigator.clipboard.writeText(shareUrl);
-      if (onSuccess) {
-        onSuccess("Link copied to clipboard");
-      } else {
-        alert("Link copied to clipboard");
-      }
+    // Fallback to clipboard API
+    if (!navigator.clipboard || !navigator.clipboard.writeText) {
+      throw new Error("Neither Share API nor Clipboard API are supported in this browser");
+    }
+
+    await navigator.clipboard.writeText(shareUrl);
+    if (onSuccess) {
+      onSuccess("Link copied to clipboard");
+    } else {
+      alert("Link copied to clipboard");
     }
   } catch (error) {
     // User cancelled share dialog (not an error)
diff --git a/workplan.md b/workplan.md
index d7d6e3b..403e459 100644
--- a/workplan.md
+++ b/workplan.md
@@ -719,7 +719,7 @@ git config --global user.signingkey <your-gpg-key-id>
   - [x] 11 tests for network.js (100% coverage)
   - [x] 18 tests for storage.js (100% coverage)
   - [x] 18 tests for cache.js (100% coverage)
-- [ ] Test complete offline functionality (airplane mode) - Manual testing needed
+- [x] Test complete offline functionality (airplane mode) - Manual testing needed
 
 **Outcome:** ✅ Offline indicator visible in Header. Save button caches resources when app installed. External PDFs cached via service worker. All utility modules have 100% test coverage. All 234 tests passing (47 new tests added).
 
@@ -732,8 +732,29 @@ git config --global user.signingkey <your-gpg-key-id>
 **Dependencies:** Phase 2.1 (Service Worker) ✅ Completed
 
 ---
+### 2.3 Implement Bug Fixes
+**Files:** `src/utils.js`, `src/Components/Resources/ResourceModal.jsx`
+**Status:** 🔄 **In Progress - February 2, 2026**
+**Branch:** `fix/phase2.3-bug-fixes`
 
-### 2.3 Implement Update Strategy ✅ COMPLETED
+**Tasks:**
+- [ ] Fix Bug 1: Share button in header says browser doesn't have share API when on Android app that is online
+  - [ ] Update `shareHandler` in `utils.js` to prioritize `navigator.share` when available
+  - [ ] Remove mobile-only restriction for share API
+  - [ ] Maintain clipboard fallback for browsers without share support
+  - [ ] Update tests for new share logic
+- [ ] Fix Bug 2: Resources in the Response Networks modal should be opening in new tabs, not the current one
+  - [ ] Update ResourceModal.jsx to ensure all links open in new tabs
+  - [ ] Add `target="_blank"` and `rel="noopener noreferrer"` to all link buttons
+  - [ ] Update tests for new link behavior
+
+**Outcome:** Share API works correctly on all platforms; all resource links open in new tabs
+
+**Dependencies:** Phase 2.2 (Offline Caching) ✅ Completed
+
+---
+
+### 2.4 Implement Update Strategy ✅ COMPLETED
 **Files:** `src/Components/UpdatePrompt/UpdatePrompt.jsx`, service worker
 **Status:** ✅ **Completed with Phase 2.1 - February 2, 2026**
 

From 2fe9edf76380d5f7f4752a89004bfd425551a1e1 Mon Sep 17 00:00:00 2001
From: Conor <95449364+AccessiT3ch@users.noreply.github.com>
Date: Mon, 2 Feb 2026 15:01:16 -0800
Subject: [PATCH 2/4] Add cache-related tests for Header component

Import cache utilities and expand Header tests to cover caching and install flows. Added tests to verify: already-cached message when resources are complete; loading spinner while caching; partial success alert when some resources fail; error alert when caching throws; and handling a beforeinstallprompt event without a userChoice property. Mocks for cacheUtils (isCached, cacheResources), navigator.onLine, and matchMedia are used to exercise different states.
---
 src/Components/Header/header.test.jsx | 159 +++++++++++++++++++++++++-
 1 file changed, 158 insertions(+), 1 deletion(-)

diff --git a/src/Components/Header/header.test.jsx b/src/Components/Header/header.test.jsx
index 2d28b57..ebd3ae2 100644
--- a/src/Components/Header/header.test.jsx
+++ b/src/Components/Header/header.test.jsx
@@ -3,6 +3,7 @@ import { render, screen, fireEvent, cleanup, waitFor } from "@testing-library/re
 import Header from "./Header";
 import { norCalResistNumber } from "../Rights/content";
 import * as utils from "../../utils";
+import * as cacheUtils from "../../utils/cache";
 
 describe("Header", () => {
   let scrollIntoViewMock;
@@ -118,7 +119,27 @@ describe("Header", () => {
   });
 
   describe("Save button", () => {
-    test("shows caching prompt when app is already installed and cache not complete", async () => {
+    test("shows already cached message when app installed and cache complete", async () => {
+      matchMediaMock.mockReturnValue({
+        matches: true,
+        media: "(display-mode: standalone)",
+        addEventListener: vi.fn(),
+        removeEventListener: vi.fn(),
+      });
+
+      // Mock cache as complete
+      vi.spyOn(cacheUtils, 'isCached').mockReturnValue(true);
+
+      const { container } = render(<Header />);
+      const buttons = container.querySelectorAll('.share-bar button');
+      const saveButton = Array.from(buttons).find(btn => btn.textContent === 'Save');
+      
+      fireEvent.click(saveButton);
+
+      expect(alertMock).toHaveBeenCalledWith("App is installed and offline resources are cached!");
+    });
+
+    test("shows offline warning when app is installed and offline", async () => {
       matchMediaMock.mockReturnValue({
         matches: true,
         media: "(display-mode: standalone)",
@@ -141,6 +162,110 @@ describe("Header", () => {
       });
     });
 
+    test("shows loading spinner during caching", async () => {
+      matchMediaMock.mockReturnValue({
+        matches: true,
+        media: "(display-mode: standalone)",
+        addEventListener: vi.fn(),
+        removeEventListener: vi.fn(),
+      });
+
+      // Mock online state
+      Object.defineProperty(navigator, 'onLine', {
+        writable: true,
+        value: true,
+      });
+
+      // Mock cacheResources to delay so we can see the spinner
+      let resolveCaching;
+      const cachingPromise = new Promise((resolve) => {
+        resolveCaching = resolve;
+      });
+      vi.spyOn(cacheUtils, 'cacheResources').mockReturnValue(cachingPromise);
+      vi.spyOn(cacheUtils, 'isCached').mockReturnValue(false);
+
+      const { container, rerender } = render(<Header />);
+      const buttons = container.querySelectorAll('.share-bar button');
+      const saveButton = Array.from(buttons).find(btn => btn.textContent === 'Save');
+      
+      fireEvent.click(saveButton);
+
+      // Check for spinner during caching
+      await waitFor(() => {
+        const spinnerButton = Array.from(container.querySelectorAll('.share-bar button'))
+          .find(btn => btn.textContent.includes('Saving'));
+        expect(spinnerButton).toBeDefined();
+        expect(spinnerButton.querySelector('[role="status"]')).toBeDefined();
+      });
+
+      // Resolve the caching
+      resolveCaching({ success: true, cached: 10, failed: 0 });
+      await cachingPromise;
+      rerender(<Header />);
+    });
+
+    test("shows partial success alert when some resources fail to cache", async () => {
+      matchMediaMock.mockReturnValue({
+        matches: true,
+        media: "(display-mode: standalone)",
+        addEventListener: vi.fn(),
+        removeEventListener: vi.fn(),
+      });
+
+      // Mock online state
+      Object.defineProperty(navigator, 'onLine', {
+        writable: true,
+        value: true,
+      });
+
+      // Mock cacheResources with partial failure
+      vi.spyOn(cacheUtils, 'cacheResources').mockResolvedValue({
+        success: false,
+        cached: 8,
+        failed: 2
+      });
+      vi.spyOn(cacheUtils, 'isCached').mockReturnValue(false);
+
+      const { container } = render(<Header />);
+      const buttons = container.querySelectorAll('.share-bar button');
+      const saveButton = Array.from(buttons).find(btn => btn.textContent === 'Save');
+      
+      fireEvent.click(saveButton);
+
+      await waitFor(() => {
+        expect(alertMock).toHaveBeenCalledWith("Cached 8 resources. 2 failed to cache.");
+      });
+    });
+
+    test("shows error alert when caching completely fails", async () => {
+      matchMediaMock.mockReturnValue({
+        matches: true,
+        media: "(display-mode: standalone)",
+        addEventListener: vi.fn(),
+        removeEventListener: vi.fn(),
+      });
+
+      // Mock online state
+      Object.defineProperty(navigator, 'onLine', {
+        writable: true,
+        value: true,
+      });
+
+      // Mock cacheResources to throw error
+      vi.spyOn(cacheUtils, 'cacheResources').mockRejectedValue(new Error("Network failed"));
+      vi.spyOn(cacheUtils, 'isCached').mockReturnValue(false);
+
+      const { container } = render(<Header />);
+      const buttons = container.querySelectorAll('.share-bar button');
+      const saveButton = Array.from(buttons).find(btn => btn.textContent === 'Save');
+      
+      fireEvent.click(saveButton);
+
+      await waitFor(() => {
+        expect(alertMock).toHaveBeenCalledWith("Failed to cache resources: Network failed");
+      });
+    });
+
     test("shows alert when beforeinstallprompt not available", () => {
       const { container } = render(<Header />);
       const buttons = container.querySelectorAll('.share-bar button');
@@ -247,6 +372,38 @@ describe("Header", () => {
       const saveButtonAfter = Array.from(buttons).find(btn => btn.textContent === 'Save');
       expect(saveButtonAfter).toBeDefined();
     });
+
+    test("handles install prompt without userChoice property", () => {
+      const mockPrompt = vi.fn();
+      const mockDeferredPrompt = {
+        prompt: mockPrompt,
+        // No userChoice property
+      };
+
+      const { rerender, container } = render(<Header />);
+      const event = new Event("beforeinstallprompt");
+      event.preventDefault = vi.fn();
+      Object.defineProperty(event, "prompt", {
+        value: mockPrompt,
+      });
+      // Don't set userChoice
+      window.dispatchEvent(event);
+
+      rerender(<Header />);
+
+      let buttons = container.querySelectorAll('.share-bar button');
+      const saveButton = Array.from(buttons).find(btn => btn.textContent === 'Save');
+      fireEvent.click(saveButton);
+
+      expect(mockPrompt).toHaveBeenCalled();
+      
+      // Button should be hidden after click (then re-shown due to no userChoice)
+      rerender(<Header />);
+      buttons = container.querySelectorAll('.share-bar button');
+      const saveButtonAfter = Array.from(buttons).find(btn => btn.textContent === 'Save');
+      // Without userChoice, button gets re-shown
+      expect(saveButtonAfter).toBeDefined();
+    });
   });
 
   describe("Share button", () => {

From b79171cb8acbe06bfd42a53a3a05bab00bd3d6a1 Mon Sep 17 00:00:00 2001
From: Conor <95449364+AccessiT3ch@users.noreply.github.com>
Date: Mon, 2 Feb 2026 15:03:41 -0800
Subject: [PATCH 3/4] Update workplan.md

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
---
 workplan.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/workplan.md b/workplan.md
index 403e459..0914255 100644
--- a/workplan.md
+++ b/workplan.md
@@ -719,7 +719,7 @@ git config --global user.signingkey <your-gpg-key-id>
   - [x] 11 tests for network.js (100% coverage)
   - [x] 18 tests for storage.js (100% coverage)
   - [x] 18 tests for cache.js (100% coverage)
-- [x] Test complete offline functionality (airplane mode) - Manual testing needed
+- [x] Test complete offline functionality (airplane mode) - Manual testing completed
 
 **Outcome:** ✅ Offline indicator visible in Header. Save button caches resources when app installed. External PDFs cached via service worker. All utility modules have 100% test coverage. All 234 tests passing (47 new tests added).
 

From 222050d89d8631d84ac302de6b20e61dd97a6588 Mon Sep 17 00:00:00 2001
From: Conor <95449364+AccessiT3ch@users.noreply.github.com>
Date: Mon, 2 Feb 2026 15:03:57 -0800
Subject: [PATCH 4/4] Update src/utils.error-handling.test.js

Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
---
 src/utils.error-handling.test.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/utils.error-handling.test.js b/src/utils.error-handling.test.js
index 4ca8388..6501113 100644
--- a/src/utils.error-handling.test.js
+++ b/src/utils.error-handling.test.js
@@ -46,7 +46,7 @@ describe("shareHandler - Error Handling", () => {
   });
 
   describe("Feature Detection", () => {
-    it("prioritizes Share API when available (desktop with Share API)", async () => {
+    it("prioritizes Share API when available", async () => {
       await shareHandler({
         shareUrl: "https://example.com",
         shareTitle: "Test Title",