From 275fc1bc7e5fdc322f08cfb156eda14d58d0231c Mon Sep 17 00:00:00 2001 From: Jimmy Vo Date: Fri, 14 Mar 2025 15:13:26 -0400 Subject: [PATCH] Decouple the phishing detection content script logic from the rest of the app. --- .../phishing-detection-browser.service.ts | 66 +++++++++++++++++++ ...ger-phishing-detection-script-injection.ts | 15 ++--- 2 files changed, 72 insertions(+), 9 deletions(-) create mode 100644 apps/browser/src/phishing-detection/content/phishing-detection-browser.service.ts diff --git a/apps/browser/src/phishing-detection/content/phishing-detection-browser.service.ts b/apps/browser/src/phishing-detection/content/phishing-detection-browser.service.ts new file mode 100644 index 00000000000..9f4f9374a62 --- /dev/null +++ b/apps/browser/src/phishing-detection/content/phishing-detection-browser.service.ts @@ -0,0 +1,66 @@ +import { Utils } from "@bitwarden/common/platform/misc/utils"; + +export class PhishingDetectionBrowserService { + private static knownPhishingDomains = new Set(); + + static checkUrl(url: string): boolean { + const domain = Utils.getDomain(url); + return PhishingDetectionBrowserService.knownPhishingDomains.has(domain); + } + + static notifyUser(url: string) { + const phishingDivId = "phishing-notification-bar"; + const message = `${url} is a known phishing site`; + + const wrapper = document.createElement("div"); + wrapper.id = phishingDivId; + wrapper.classList.add("inner-wrapper"); + + wrapper.style.position = "fixed"; + wrapper.style.top = "20px"; + wrapper.style.right = "20px"; + wrapper.style.zIndex = "10000"; + wrapper.style.backgroundColor = "#fff"; + wrapper.style.padding = "15px"; + wrapper.style.border = "1px solid #ccc"; + wrapper.style.borderRadius = "5px"; + wrapper.style.boxShadow = "0 2px 10px rgba(0,0,0,0.2)"; + + const messageElement = document.createElement("div"); + messageElement.id = "change-text"; + messageElement.classList.add("notification-body"); + messageElement.textContent = message; + + const exitButton = document.createElement("button"); + exitButton.type = "button"; + exitButton.id = "change-exit"; + exitButton.classList.add("primary"); + exitButton.textContent = "Exit the page"; + + wrapper.appendChild(messageElement); + wrapper.appendChild(exitButton); + + document.body.appendChild(wrapper); + + setTimeout(() => { + if (document.body.contains(wrapper)) { + document.body.removeChild(wrapper); + } + }, 10000); + } + + static getActiveUrl() { + return window?.location?.href; + } + + // @TODO: This can be remove once we implement the real code. + static loadMockedData() { + PhishingDetectionBrowserService.knownPhishingDomains.add("google.com"); + PhishingDetectionBrowserService.knownPhishingDomains.add("atlassian.net"); + PhishingDetectionBrowserService.knownPhishingDomains.add("example.com"); + PhishingDetectionBrowserService.knownPhishingDomains.add("w3schools.com"); + } +} + +// Initializing the data for local development +PhishingDetectionBrowserService.loadMockedData(); diff --git a/apps/browser/src/phishing-detection/trigger-phishing-detection-script-injection.ts b/apps/browser/src/phishing-detection/trigger-phishing-detection-script-injection.ts index 4312b3f304a..37ea922c880 100644 --- a/apps/browser/src/phishing-detection/trigger-phishing-detection-script-injection.ts +++ b/apps/browser/src/phishing-detection/trigger-phishing-detection-script-injection.ts @@ -1,7 +1,5 @@ -/* eslint-disable @typescript-eslint/no-unused-vars */ /* eslint-disable no-console */ -// eslint-disable-next-line no-restricted-imports -import { PhishingDetectionService } from "src/platform/services/phishing-detection.service"; +import { PhishingDetectionBrowserService } from "./content/phishing-detection-browser.service"; if (document.readyState === "loading") { document.addEventListener("DOMContentLoaded", loadPhishingDetectionContent); @@ -10,12 +8,11 @@ if (document.readyState === "loading") { } async function loadPhishingDetectionContent() { - // Found an issue with the internal PhishingDetectionService not being able to initialize properly. - // const activeUrl = await PhishingDetectionService.getActiveUrl(); - // const isPhishingDomain = PhishingDetectionService.checkUrl(activeUrl); - // if (isPhishingDomain) { - // PhishingDetectionService.notifyUser(activeUrl); - // } + const activeUrl = PhishingDetectionBrowserService.getActiveUrl(); + const isPhishingDomain = PhishingDetectionBrowserService.checkUrl(activeUrl); + if (isPhishingDomain) { + PhishingDetectionBrowserService.notifyUser(activeUrl); + } } console.log("Phishing Detection Service loaded.");