refactor: migracja wywołań API przeglądarki do abstrakcji browserAPI #127

Open
am0 wants to merge 1 commits from refactor/build_time_abstraction into develop
Collaborator

Zmigrowano wszystkie bezpośrednie wywołania browser.* API do zunifikowanej abstrakcji browserAPI, umożliwiając budowanie rozszerzenia zarówno dla Firefox (browser.browserAction) jak i Chrome (chrome.action) z jednego kodu źródłowego.

Zmigrowane pliki aplikacji (4):

1. memory.ts

Dodano import:

  • import browserAPI from ./lib/browser-api

Zastąpiono wywołania API:

  • browser.browserAction.setBadgeText → browserAPI.badge.setBadgeText
  • browser.browserAction.setTitle → browserAPI.badge.setTitle
  • browser.browserAction.setBadgeBackgroundColor → browserAPI.badge.setBadgeBackgroundColor
  • browser.webRequest.onBeforeRequest.addListener → browserAPI.webRequest.onBeforeRequest.addListener
  • browser.webRequest.onBeforeSendHeaders.addListener → browserAPI.webRequest.onBeforeSendHeaders.addListener
  • browser.cookies.getAll → browserAPI.cookies.getAll
  • browser.cookies.remove → browserAPI.cookies.remove
  • browser.extension.getBackgroundPage() → browserAPI.extension.getBackgroundPage()

Dodano obsługę null:

  • Funkcja getMemory() sprawdza teraz czy getBackgroundPage() nie zwraca null

2. components/toolbar/toolbar.tsx

Dodano import:

  • import browserAPI from ../../lib/browser-api

Zastąpiono wywołania API:

  • browser.tabs.query → browserAPI.tabs.query
  • browser.windows.WINDOW_ID_CURRENT → browserAPI.windows.WINDOW_ID_CURRENT
  • browser.tabs.onUpdated.addListener → browserAPI.tabs.onUpdated.addListener
  • browser.tabs.onUpdated.removeListener → browserAPI.tabs.onUpdated.removeListener

Zachowano całą funkcjonalność:

  • Wszystkie sekcje UI (header, summary z licznikami, details, about, actions)
  • Wszystkie hooki React i logika biznesowa
  • Funkcje pomocnicze (getCurrentTab, isDomainHighlySuspicious, autoMark)

3. components/tab-dropdown.tsx

Zmieniono importy:

  • Usunięto: import { Tab } from ../../util
  • Dodano: import browserAPI, { Tab } from ../../lib/browser-api

Zastąpiono wywołania API:

  • browser.tabs.query({ currentWindow: true }) → browserAPI.tabs.query({ currentWindow: true })

Poprawka typów:

  • Typ Tab teraz pochodzi z browserAPI, zapewniając zgodność typów

4. util.ts

Dodano import:

  • import browserAPI from ./lib/browser-api

Zastąpiono wywołania API:

  • Typ Tab pochodzi teraz z browserAPI.tabs.query zamiast browser.tabs.query
  • browser.tabs.query({ currentWindow: true }) → browserAPI.tabs.query({ currentWindow: true }) w funkcji getTabByID

Zachowano wszystkie funkcje:

  • getshorthost, useEmitter, parseCookie, getTabByID
  • parseToObject, isJSONObject, isURL, hyphenate, unique
  • allSubhosts, reduceConcat, getDate, toBase64, makeThrottle
  • isSameURL, isBase64, isBase64JSON
  • flattenObject, flattenObjectEntries
  • maskString, safeDecodeURIComponent, normalizeForClassname
  • wordlist, dataLocationToText, downloadText

Rozszerzenie abstrakcji browserAPI:

lib/browser-api/types.ts

Dlaczego rozszerzono:
Początkowy minimalny interfejs RequestDetails był niewystarczający, ponieważ brakowało kluczowych właściwości wymaganych przez konstruktor ExtendedRequest. Gdy listenery webRequest są wywoływane, przekazują kompletny obiekt Request do ExtendedRequest, a nie tylko podstawowe szczegóły.

Co zostało dodane:
Pełny typ Request z util.ts, zawierający:

  • Właściwości główne: requestId, tabId, url, method, type
  • Nawigacja ramek: frameId, parentFrameId, documentUrl, originUrl
  • Opcjonalne metadane: cookieStoreId, incognito, thirdParty, timeStamp
  • Szczegóły żądania: requestHeaders, urlClassification, proxyInfo

Przyczyna źródłowa błędów TypeScript:
Konstruktor ExtendedRequest oczekiwał właściwości takich jak frameId, method,
originUrl, parentFrameId, documentUrl, urlClassification, etc. Minimalny
interfejs powodował błędy:

  • Argument of type RequestDetails is not assignable to parameter of type Request
  • Type RequestDetails is missing properties: frameId, method, originUrl, parentFrameId, and 4 more

Rozwiązanie:
Używając pełnej definicji typu Request, abstrakcja browserAPI poprawnie typuje callbacki webRequest, zapewniając bezpieczeństwo typów zarówno dla buildu Firefox jak i Chrome, przy zachowaniu kompatybilności z istniejącą implementacją ExtendedRequest.

Zmiana w RequestListener:

  • Było: (details: RequestDetails) => void
  • Jest: (details: Request) => void

Wpływ zmian:

  • memory.ts, toolbar.tsx, tab-dropdown.tsx, util.ts działają z TARGET=firefox i TARGET=chrome
  • Zachowano bezpieczeństwo typów w całym kodzie
  • Brak zmian funkcjonalnych - tylko warstwa abstrakcji
  • Gotowość do kompatybilności z Chrome Manifest V3 (chrome.action vs browser.browserAction)

Następne kroki:

  • Aktualizacja esbuild.config.js dla budowania z TARGET=chrome do dist-chrome/
  • Aktualizacja manifestu Chrome zgodnie z regułami Manifest v3
  • Skrypt konwertujący SVG na PNG dla Chrome
  • Testowanie rozszerzenia w przeglądarce Chrome
Zmigrowano wszystkie bezpośrednie wywołania browser.* API do zunifikowanej abstrakcji browserAPI, umożliwiając budowanie rozszerzenia zarówno dla Firefox (browser.browserAction) jak i Chrome (chrome.action) z jednego kodu źródłowego. ## Zmigrowane pliki aplikacji (4): ### 1. memory.ts Dodano import: - import browserAPI from ./lib/browser-api Zastąpiono wywołania API: - browser.browserAction.setBadgeText → browserAPI.badge.setBadgeText - browser.browserAction.setTitle → browserAPI.badge.setTitle - browser.browserAction.setBadgeBackgroundColor → browserAPI.badge.setBadgeBackgroundColor - browser.webRequest.onBeforeRequest.addListener → browserAPI.webRequest.onBeforeRequest.addListener - browser.webRequest.onBeforeSendHeaders.addListener → browserAPI.webRequest.onBeforeSendHeaders.addListener - browser.cookies.getAll → browserAPI.cookies.getAll - browser.cookies.remove → browserAPI.cookies.remove - browser.extension.getBackgroundPage() → browserAPI.extension.getBackgroundPage() Dodano obsługę null: - Funkcja getMemory() sprawdza teraz czy getBackgroundPage() nie zwraca null ### 2. components/toolbar/toolbar.tsx Dodano import: - import browserAPI from ../../lib/browser-api Zastąpiono wywołania API: - browser.tabs.query → browserAPI.tabs.query - browser.windows.WINDOW_ID_CURRENT → browserAPI.windows.WINDOW_ID_CURRENT - browser.tabs.onUpdated.addListener → browserAPI.tabs.onUpdated.addListener - browser.tabs.onUpdated.removeListener → browserAPI.tabs.onUpdated.removeListener Zachowano całą funkcjonalność: - Wszystkie sekcje UI (header, summary z licznikami, details, about, actions) - Wszystkie hooki React i logika biznesowa - Funkcje pomocnicze (getCurrentTab, isDomainHighlySuspicious, autoMark) ### 3. components/tab-dropdown.tsx Zmieniono importy: - Usunięto: import { Tab } from ../../util - Dodano: import browserAPI, { Tab } from ../../lib/browser-api Zastąpiono wywołania API: - browser.tabs.query({ currentWindow: true }) → browserAPI.tabs.query({ currentWindow: true }) Poprawka typów: - Typ Tab teraz pochodzi z browserAPI, zapewniając zgodność typów ### 4. util.ts Dodano import: - import browserAPI from ./lib/browser-api Zastąpiono wywołania API: - Typ Tab pochodzi teraz z browserAPI.tabs.query zamiast browser.tabs.query - browser.tabs.query({ currentWindow: true }) → browserAPI.tabs.query({ currentWindow: true }) w funkcji getTabByID Zachowano wszystkie funkcje: - getshorthost, useEmitter, parseCookie, getTabByID - parseToObject, isJSONObject, isURL, hyphenate, unique - allSubhosts, reduceConcat, getDate, toBase64, makeThrottle - isSameURL, isBase64, isBase64JSON - flattenObject, flattenObjectEntries - maskString, safeDecodeURIComponent, normalizeForClassname - wordlist, dataLocationToText, downloadText ## Rozszerzenie abstrakcji browserAPI: ### lib/browser-api/types.ts Dlaczego rozszerzono: Początkowy minimalny interfejs RequestDetails był niewystarczający, ponieważ brakowało kluczowych właściwości wymaganych przez konstruktor ExtendedRequest. Gdy listenery webRequest są wywoływane, przekazują kompletny obiekt Request do ExtendedRequest, a nie tylko podstawowe szczegóły. Co zostało dodane: Pełny typ Request z util.ts, zawierający: - Właściwości główne: requestId, tabId, url, method, type - Nawigacja ramek: frameId, parentFrameId, documentUrl, originUrl - Opcjonalne metadane: cookieStoreId, incognito, thirdParty, timeStamp - Szczegóły żądania: requestHeaders, urlClassification, proxyInfo Przyczyna źródłowa błędów TypeScript: Konstruktor ExtendedRequest oczekiwał właściwości takich jak frameId, method, originUrl, parentFrameId, documentUrl, urlClassification, etc. Minimalny interfejs powodował błędy: - Argument of type RequestDetails is not assignable to parameter of type Request - Type RequestDetails is missing properties: frameId, method, originUrl, parentFrameId, and 4 more Rozwiązanie: Używając pełnej definicji typu Request, abstrakcja browserAPI poprawnie typuje callbacki webRequest, zapewniając bezpieczeństwo typów zarówno dla buildu Firefox jak i Chrome, przy zachowaniu kompatybilności z istniejącą implementacją ExtendedRequest. Zmiana w RequestListener: - Było: (details: RequestDetails) => void - Jest: (details: Request) => void ## Wpływ zmian: - memory.ts, toolbar.tsx, tab-dropdown.tsx, util.ts działają z TARGET=firefox i TARGET=chrome - Zachowano bezpieczeństwo typów w całym kodzie - Brak zmian funkcjonalnych - tylko warstwa abstrakcji - Gotowość do kompatybilności z Chrome Manifest V3 (chrome.action vs browser.browserAction) ## Następne kroki: - Aktualizacja esbuild.config.js dla budowania z TARGET=chrome do dist-chrome/ - Aktualizacja manifestu Chrome zgodnie z regułami Manifest v3 - Skrypt konwertujący SVG na PNG dla Chrome - Testowanie rozszerzenia w przeglądarce Chrome
am0 added 1 commit 2025-09-30 12:22:50 +02:00
Zmigrowano wszystkie bezpośrednie wywołania browser.* API do zunifikowanej abstrakcji browserAPI, umożliwiając budowanie rozszerzenia zarówno dla Firefox (browser.browserAction) jak i Chrome (chrome.action) z jednego kodu źródłowego.

## Zmigrowane pliki aplikacji (4):

### 1. memory.ts
Dodano import:
- import browserAPI from ./lib/browser-api

Zastąpiono wywołania API:
- browser.browserAction.setBadgeText → browserAPI.badge.setBadgeText
- browser.browserAction.setTitle → browserAPI.badge.setTitle
- browser.browserAction.setBadgeBackgroundColor → browserAPI.badge.setBadgeBackgroundColor
- browser.webRequest.onBeforeRequest.addListener → browserAPI.webRequest.onBeforeRequest.addListener
- browser.webRequest.onBeforeSendHeaders.addListener → browserAPI.webRequest.onBeforeSendHeaders.addListener
- browser.cookies.getAll → browserAPI.cookies.getAll
- browser.cookies.remove → browserAPI.cookies.remove
- browser.extension.getBackgroundPage() → browserAPI.extension.getBackgroundPage()

Dodano obsługę null:
- Funkcja getMemory() sprawdza teraz czy getBackgroundPage() nie zwraca null

### 2. components/toolbar/toolbar.tsx
Dodano import:
- import browserAPI from ../../lib/browser-api

Zastąpiono wywołania API:
- browser.tabs.query → browserAPI.tabs.query
- browser.windows.WINDOW_ID_CURRENT → browserAPI.windows.WINDOW_ID_CURRENT
- browser.tabs.onUpdated.addListener → browserAPI.tabs.onUpdated.addListener
- browser.tabs.onUpdated.removeListener → browserAPI.tabs.onUpdated.removeListener

Zachowano całą funkcjonalność:
- Wszystkie sekcje UI (header, summary z licznikami, details, about, actions)
- Wszystkie hooki React i logika biznesowa
- Funkcje pomocnicze (getCurrentTab, isDomainHighlySuspicious, autoMark)

### 3. components/tab-dropdown.tsx
Zmieniono importy:
- Usunięto: import { Tab } from ../../util
- Dodano: import browserAPI, { Tab } from ../../lib/browser-api

Zastąpiono wywołania API:
- browser.tabs.query({ currentWindow: true }) → browserAPI.tabs.query({ currentWindow: true })

Poprawka typów:
- Typ Tab teraz pochodzi z browserAPI, zapewniając zgodność typów

### 4. util.ts
Dodano import:
- import browserAPI from ./lib/browser-api

Zastąpiono wywołania API:
- Typ Tab pochodzi teraz z browserAPI.tabs.query zamiast browser.tabs.query
- browser.tabs.query({ currentWindow: true }) → browserAPI.tabs.query({ currentWindow: true }) w funkcji getTabByID

Zachowano wszystkie funkcje:
- getshorthost, useEmitter, parseCookie, getTabByID
- parseToObject, isJSONObject, isURL, hyphenate, unique
- allSubhosts, reduceConcat, getDate, toBase64, makeThrottle
- isSameURL, isBase64, isBase64JSON
- flattenObject, flattenObjectEntries
- maskString, safeDecodeURIComponent, normalizeForClassname
- wordlist, dataLocationToText, downloadText

## Rozszerzenie abstrakcji browserAPI:

### lib/browser-api/types.ts
Dlaczego rozszerzono:
Początkowy minimalny interfejs RequestDetails był niewystarczający, ponieważ brakowało kluczowych właściwości wymaganych przez konstruktor ExtendedRequest. Gdy listenery webRequest są wywoływane, przekazują kompletny obiekt Request do ExtendedRequest, a nie tylko podstawowe szczegóły.

Co zostało dodane:
Pełny typ Request z util.ts, zawierający:
- Właściwości główne: requestId, tabId, url, method, type
- Nawigacja ramek: frameId, parentFrameId, documentUrl, originUrl
- Opcjonalne metadane: cookieStoreId, incognito, thirdParty, timeStamp
- Szczegóły żądania: requestHeaders, urlClassification, proxyInfo

Przyczyna źródłowa błędów TypeScript:
Konstruktor ExtendedRequest oczekiwał właściwości takich jak frameId, method,
originUrl, parentFrameId, documentUrl, urlClassification, etc. Minimalny
interfejs powodował błędy:
- Argument of type RequestDetails is not assignable to parameter of type Request
- Type RequestDetails is missing properties: frameId, method, originUrl, parentFrameId, and 4 more

Rozwiązanie:
Używając pełnej definicji typu Request, abstrakcja browserAPI poprawnie typuje callbacki webRequest, zapewniając bezpieczeństwo typów zarówno dla buildu Firefox jak i Chrome, przy zachowaniu kompatybilności z istniejącą implementacją ExtendedRequest.

Zmiana w RequestListener:
- Było: (details: RequestDetails) => void
- Jest: (details: Request) => void

## Wpływ zmian:
- memory.ts, toolbar.tsx, tab-dropdown.tsx, util.ts działają z TARGET=firefox i TARGET=chrome
- Zachowano bezpieczeństwo typów w całym kodzie
- Brak zmian funkcjonalnych - tylko warstwa abstrakcji
- Gotowość do kompatybilności z Chrome Manifest V3 (chrome.action vs browser.browserAction)

## Następne kroki:
- Aktualizacja esbuild.config.js dla budowania z TARGET=chrome do dist-chrome/
- Aktualizacja manifestu Chrome zgodnie z regułami Manifest v3
- Skrypt konwertujący SVG na PNG dla Chrome
- Testowanie rozszerzenia w przeglądarce Chrome
This pull request can be merged automatically.
This branch is out-of-date with the base branch
You are not authorized to merge this pull request.

Checkout

From your project repository, check out a new branch and test the changes.
git fetch -u origin refactor/build_time_abstraction:refactor/build_time_abstraction
git checkout refactor/build_time_abstraction
Sign in to join this conversation.
No Reviewers
1 Participants
Notifications
Due Date
No due date set.
Reference: icd/rentgen#127
No description provided.