5 Commits

Author SHA1 Message Date
semantic-release-bot
326e585021 chore(release): 1.8.4
## [1.8.4](https://github.com/obsqrbtz/goose-highlighter/compare/v1.8.3...v1.8.4) (2025-10-28)

### Bug Fixes

* do not re-highlight when already processing highlights ([8be53f3](8be53f3240))
2025-10-28 15:32:14 +03:00
8be53f3240 fix: do not re-highlight when already processing highlights 2025-10-28 15:31:46 +03:00
f07617fa55 Merge branch 'main' of https://github.com/obsqrbtz/goose-highlighter 2025-10-09 16:18:53 +03:00
e79874922a added logo 2025-10-09 16:18:36 +03:00
71216cbcd9 ci: update manifest in publish workflow 2025-10-08 17:54:06 +03:00
7 changed files with 47 additions and 28 deletions

View File

@@ -33,6 +33,9 @@ jobs:
id: version id: version
run: echo "VERSION=${GITHUB_REF#refs/tags/v}" >> $GITHUB_OUTPUT run: echo "VERSION=${GITHUB_REF#refs/tags/v}" >> $GITHUB_OUTPUT
- name: Update manifest version
run: node scripts/update-manifest-version.js ${{ steps.version.outputs.VERSION }}
- name: Create zip package - name: Create zip package
run: | run: |
zip -r goose-highlighter.zip . -x '*.git*' 'node_modules/*' 'src/*' 'scripts/*' 'versioning.md' '.releaserc.json' 'package.json' 'package-lock.json' 'README.md' 'tsconfig.json' 'eslint.config.mjs' zip -r goose-highlighter.zip . -x '*.git*' 'node_modules/*' 'src/*' 'scripts/*' 'versioning.md' '.releaserc.json' 'package.json' 'package-lock.json' 'README.md' 'tsconfig.json' 'eslint.config.mjs'

View File

@@ -1,3 +1,10 @@
## [1.8.4](https://github.com/obsqrbtz/goose-highlighter/compare/v1.8.3...v1.8.4) (2025-10-28)
### Bug Fixes
* do not re-highlight when already processing highlights ([8be53f3](https://github.com/obsqrbtz/goose-highlighter/commit/8be53f32402c2f0f228ca003ef3805c5ff0b6e88))
## [1.8.3](https://github.com/obsqrbtz/goose-highlighter/compare/v1.8.2...v1.8.3) (2025-10-08) ## [1.8.3](https://github.com/obsqrbtz/goose-highlighter/compare/v1.8.2...v1.8.3) (2025-10-08)

View File

@@ -1,4 +1,4 @@
# Goose Highlighter # <img src="img/logo.png" alt="Goose Highlighter Logo" width="32" style="vertical-align: middle;"> Goose Highlighter
Goose Highlighter is a browser extension that allows you to highlight words on any webpage. Goose Highlighter is a browser extension that allows you to highlight words on any webpage.

BIN
img/logo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 MiB

View File

@@ -2,7 +2,7 @@
"manifest_version": 3, "manifest_version": 3,
"name": "__MSG_extension_name__", "name": "__MSG_extension_name__",
"description": "__MSG_extension_description__", "description": "__MSG_extension_description__",
"version": "1.8.3", "version": "1.8.4",
"default_locale": "en", "default_locale": "en",
"permissions": [ "permissions": [
"scripting", "scripting",

View File

@@ -68,7 +68,7 @@ export class ContentScript {
} }
private setupScrollHandler(): void { private setupScrollHandler(): void {
const debouncedProcess = DOMUtils.debounce(() => this.processHighlights(), 300); const debouncedProcess = DOMUtils.debounce(() => this.processHighlights(), CONSTANTS.DEBOUNCE_DELAY);
window.addEventListener('scroll', debouncedProcess); window.addEventListener('scroll', debouncedProcess);
} }

View File

@@ -5,25 +5,31 @@ export class HighlightEngine {
private styleSheet: CSSStyleSheet | null = null; private styleSheet: CSSStyleSheet | null = null;
private wordStyleMap = new Map<string, string>(); private wordStyleMap = new Map<string, string>();
private observer: MutationObserver; private observer: MutationObserver;
private isHighlighting = false;
constructor(private onUpdate: () => void) { constructor(private onUpdate: () => void) {
this.observer = new MutationObserver(DOMUtils.debounce((mutations: MutationRecord[]) => { this.observer = new MutationObserver(DOMUtils.debounce((mutations: MutationRecord[]) => {
const hasRelevantChanges = mutations.some((mutation: MutationRecord) => { if (this.isHighlighting) return;
const hasContentChanges = mutations.some((mutation: MutationRecord) => {
if (mutation.type !== 'childList') return false;
if (mutation.target instanceof Element && mutation.target.hasAttribute('data-gh')) { if (mutation.target instanceof Element && mutation.target.hasAttribute('data-gh')) {
return false; return false;
} }
const addedNodes = Array.from(mutation.addedNodes);
const removedNodes = Array.from(mutation.removedNodes); const allNodes = [...Array.from(mutation.addedNodes), ...Array.from(mutation.removedNodes)];
const isOurChange = [...addedNodes, ...removedNodes].some(node => return allNodes.some(node => {
node instanceof Element && (node.hasAttribute('data-gh') || node.querySelector('[data-gh]')) if (node.nodeType === Node.TEXT_NODE) return true;
); if (node instanceof Element && !node.hasAttribute('data-gh')) return true;
return !isOurChange; return false;
});
}); });
if (hasRelevantChanges) { if (hasContentChanges) {
onUpdate(); this.onUpdate();
} }
}, 300)); }, CONSTANTS.DEBOUNCE_DELAY));
} }
private initializeStyleSheet(): void { private initializeStyleSheet(): void {
@@ -37,24 +43,24 @@ export class HighlightEngine {
private updateWordStyles(activeWords: ActiveWord[]): void { private updateWordStyles(activeWords: ActiveWord[]): void {
this.initializeStyleSheet(); this.initializeStyleSheet();
while (this.styleSheet!.cssRules.length > 0) { while (this.styleSheet!.cssRules.length > 0) {
this.styleSheet!.deleteRule(0); this.styleSheet!.deleteRule(0);
} }
this.wordStyleMap.clear(); this.wordStyleMap.clear();
const uniqueStyles = new Map<string, string>(); const uniqueStyles = new Map<string, string>();
for (const word of activeWords) { for (const word of activeWords) {
const styleKey = `${word.background}-${word.foreground}`; const styleKey = `${word.background}-${word.foreground}`;
if (!uniqueStyles.has(styleKey)) { if (!uniqueStyles.has(styleKey)) {
const className = `highlighted-word-${uniqueStyles.size}`; const className = `highlighted-word-${uniqueStyles.size}`;
uniqueStyles.set(styleKey, className); uniqueStyles.set(styleKey, className);
const rule = `.${className} { background: ${word.background}; color: ${word.foreground}; padding: 0 2px; }`; const rule = `.${className} { background: ${word.background}; color: ${word.foreground}; padding: 0 2px; }`;
this.styleSheet!.insertRule(rule, this.styleSheet!.cssRules.length); this.styleSheet!.insertRule(rule, this.styleSheet!.cssRules.length);
} }
const lookup = word.text; const lookup = word.text;
this.wordStyleMap.set(lookup, uniqueStyles.get(styleKey)!); this.wordStyleMap.set(lookup, uniqueStyles.get(styleKey)!);
} }
@@ -68,8 +74,8 @@ export class HighlightEngine {
private getTextNodes(): Text[] { private getTextNodes(): Text[] {
const textNodes: Text[] = []; const textNodes: Text[] = [];
const walker = document.createTreeWalker( const walker = document.createTreeWalker(
document.body, document.body,
NodeFilter.SHOW_TEXT, NodeFilter.SHOW_TEXT,
{ {
acceptNode: (node: Text) => { acceptNode: (node: Text) => {
if (node.parentNode && (node.parentNode as Element).hasAttribute('data-gh')) { if (node.parentNode && (node.parentNode as Element).hasAttribute('data-gh')) {
@@ -109,18 +115,22 @@ export class HighlightEngine {
} }
highlight(lists: HighlightList[], matchCase: boolean, matchWhole: boolean): void { highlight(lists: HighlightList[], matchCase: boolean, matchWhole: boolean): void {
if (this.isHighlighting) return;
this.isHighlighting = true;
this.observer.disconnect(); this.observer.disconnect();
this.clearHighlightsInternal(); this.clearHighlightsInternal();
const activeWords = this.extractActiveWords(lists); const activeWords = this.extractActiveWords(lists);
if (activeWords.length === 0) { if (activeWords.length === 0) {
this.startObserving(); this.startObserving();
this.isHighlighting = false;
return; return;
} }
this.updateWordStyles(activeWords); this.updateWordStyles(activeWords);
const wordMap = new Map<string, ActiveWord>(); const wordMap = new Map<string, ActiveWord>();
for (const word of activeWords) { for (const word of activeWords) {
const key = matchCase ? word.text : word.text.toLowerCase(); const key = matchCase ? word.text : word.text.toLowerCase();
@@ -129,11 +139,11 @@ export class HighlightEngine {
const flags = matchCase ? 'gu' : 'giu'; const flags = matchCase ? 'gu' : 'giu';
let wordsPattern = Array.from(wordMap.keys()).map(DOMUtils.escapeRegex).join('|'); let wordsPattern = Array.from(wordMap.keys()).map(DOMUtils.escapeRegex).join('|');
if (matchWhole) { if (matchWhole) {
wordsPattern = `(?:(?<!\\p{L})|^)(${wordsPattern})(?:(?!\\p{L})|$)`; wordsPattern = `(?:(?<!\\p{L})|^)(${wordsPattern})(?:(?!\\p{L})|$)`;
} }
try { try {
const pattern = new RegExp(`(${wordsPattern})`, flags); const pattern = new RegExp(`(${wordsPattern})`, flags);
const textNodes = this.getTextNodes(); const textNodes = this.getTextNodes();
@@ -155,6 +165,7 @@ export class HighlightEngine {
} }
this.startObserving(); this.startObserving();
this.isHighlighting = false;
} }
private clearHighlightsInternal(): void { private clearHighlightsInternal(): void {
@@ -166,7 +177,7 @@ export class HighlightEngine {
parent.normalize(); parent.normalize();
} }
}); });
if (this.styleSheet && this.styleSheet.cssRules.length > 0) { if (this.styleSheet && this.styleSheet.cssRules.length > 0) {
while (this.styleSheet.cssRules.length > 0) { while (this.styleSheet.cssRules.length > 0) {
this.styleSheet.deleteRule(0); this.styleSheet.deleteRule(0);
@@ -182,8 +193,6 @@ export class HighlightEngine {
this.observer.observe(document.body, { this.observer.observe(document.body, {
childList: true, childList: true,
subtree: true, subtree: true,
characterData: true,
// Don't observe attribute changes to avoid triggering on our own style changes
attributes: false attributes: false
}); });
} }