Upstream/bitwarden-browser
1
0
Fork 0
mirror of https://github.com/bitwarden/browser.git synced 2024-12-22 16:29:09 +01:00
Code Issues Projects Releases Wiki Activity

[fix] System theming in the Safari extension (#3107)

Browse Source
This commit is contained in:
Addison Beck 2022-07-14 14:47:45 -04:00 committed by GitHub
parent 97f544f7e1
commit 4be301f125
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 20 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
apps/browser/src/background/main.background.ts
View File

@ -153,6 +153,9 @@ export default class MainBackground {
broadcasterService: BroadcasterService;
folderApiService: FolderApiServiceAbstraction;
// Passed to the popup for Safari to workaround issues with theming, downloading, etc.
backgroundWindow = window;
onUpdatedRan: boolean;
onReplacedRan: boolean;
loginToAutoFill: CipherView = null;

16
apps/browser/src/popup/services/services.module.ts
View File

@ -7,6 +7,8 @@ import {
MEMORY_STORAGE,
SECURE_STORAGE,
} from "@bitwarden/angular/services/jslib-services.module";
import { ThemingService } from "@bitwarden/angular/services/theming/theming.service";
import { AbstractThemingService } from "@bitwarden/angular/services/theming/theming.service.abstraction";
import { ApiService } from "@bitwarden/common/abstractions/api.service";
import { AppIdService } from "@bitwarden/common/abstractions/appId.service";
import { AuditService } from "@bitwarden/common/abstractions/audit.service";
@ -293,6 +295,20 @@ function getBgService<T>(service: keyof MainBackground) {
provide: FileDownloadService,
useClass: BrowserFileDownloadService,
},
{
provide: AbstractThemingService,
useFactory: () => {
return new ThemingService(
getBgService<StateServiceAbstraction>("stateService")(),
// Safari doesn't properly handle the (prefers-color-scheme) media query in the popup window, it always returns light.
// In Safari we have to use the background page instead, which comes with limitations like not dynamically changing the extension theme when the system theme is changed.
getBgService<PlatformUtilsService>("platformUtilsService")().isSafari()
? getBgService<Window>("backgroundWindow")()
: window,
document
);
},
},
],
})
export class ServicesModule {}

2
libs/angular/src/services/theming/theming.service.ts
View File

@ -17,7 +17,7 @@ export class ThemingService implements AbstractThemingService {
constructor(
private stateService: StateService,
private mediaMatcher: MediaMatcher,
private mediaMatcher: MediaMatcher | Window,
@Inject(DOCUMENT) private document: Document
) {
this.monitorThemeChanges();