Added cross-browser compatibility for gekko and blink based browsers #123

Saksham-Sirohi · 2025-06-13T12:31:52Z

Fixes #120

Summary by Sourcery

Enable cross-browser support by replacing Chrome-only APIs with the standardized browser namespace, adding a compatibility polyfill, and updating manifest settings for Firefox.

New Features:

Add Firefox support with browser-specific manifest settings and polyfill script

Enhancements:

Replace all chrome.storage.local calls with browser.storage.local across main, popup, and content scripts
Include browser-polyfill.js in content scripts and popup.html to unify the browser API namespace
Rename getChromeData to getbrowserData to reflect generic browser API usage

sourcery-ai · 2025-06-13T12:31:56Z

Reviewer's Guide

This PR standardizes browser API usage by injecting a polyfill for unified chrome/browser support, migrating all storage calls to browser.storage, updating the manifest for Firefox add-on installation, and adding a Firefox-specific date-input fallback in the popup.

Sequence Diagram: Unified Storage API Calls

sequenceDiagram
    participant ES as Extension Script (e.g., popup.js)
    participant UBA as Unified Browser API (browser.*)

    ES->>UBA: browser.storage.local.get("someKey")
    activate UBA
    UBA-->>ES: Returns stored value / Promise
    deactivate UBA

    ES->>UBA: browser.storage.local.set({key: "value"})
    activate UBA
    UBA-->>ES: Callback / Promise on completion
    deactivate UBA

Class Diagram: `scrumHelper.js` Module Update

classDiagram
    class scrumHelper_module {
        +getbrowserData()
        +allIncluded()
    }
    %% Method getChromeData() was removed and replaced by getbrowserData().
    %% allIncluded() was updated internally to use getbrowserData().

Class Diagram: Global `browser` Object Polyfill

classDiagram
    class window {
        +browser: object
    }
    %% browser-polyfill.js adds the 'browser' object to the global 'window' scope 
    %% if it doesn't already exist, aliasing 'chrome' if available.

File-Level Changes

Change	Details	Files
Unified browser API with a polyfill injection	Created browser-polyfill.js to expose a window.browser API Added polyfill script to content_scripts in manifest.json Included polyfill script tag in popup.html	`src/scripts/browser-polyfill.js` `src/manifest.json` `src/popup.html`
Migrated storage API calls from chrome.storage to browser.storage	Replaced chrome.storage.local.get/set calls in main.js Updated DOMContentLoaded and click handlers in popup.js to use browser.storage Refactored scrumHelper.js to use browser.storage and renamed getChromeData to getbrowserData	`src/scripts/main.js` `src/scripts/popup.js` `src/scripts/scrumHelper.js`
Updated manifest.json for Firefox add-on support	Added browser_specific_settings.gecko with extension ID and minimum version	`src/manifest.json`
Implemented Firefox date-input fallback	Detected Firefox via navigator.userAgent flag Replaced unsupported date inputs with text placeholders Attached blur handlers to simulate native date selection	`src/scripts/popup.js`

Assessment against linked issues

Issue	Objective	Addressed	Explanation
#120	Extend the extension's compatibility to Gecko-based browsers (e.g., Firefox).	✅
#120	Maintain compatibility with currently supported browsers.	✅

Possibly linked issues

Extend browser compatibility to Gecko-based browsers while maintaining current compatibility #120: The PR adds cross-browser compatibility for Firefox by using a polyfill and updating the manifest, directly addressing the issue.
Extend browser compatibility to Gecko-based browsers while maintaining current compatibility #120: The PR adds cross-browser compatibility for Firefox and includes a Firefox-specific date-input fallback in the popup to fix the UI issue with dates.

Tips and commands

Interacting with Sourcery

Trigger a new review: Comment @sourcery-ai review on the pull request.
Continue discussions: Reply directly to Sourcery's review comments.
Generate a GitHub issue from a review comment: Ask Sourcery to create an
issue from a review comment by replying to it. You can also reply to a
review comment with @sourcery-ai issue to create an issue from it.
Generate a pull request title: Write @sourcery-ai anywhere in the pull
request title to generate a title at any time. You can also comment
@sourcery-ai title on the pull request to (re-)generate the title at any time.
Generate a pull request summary: Write @sourcery-ai summary anywhere in
the pull request body to generate a PR summary at any time exactly where you
want it. You can also comment @sourcery-ai summary on the pull request to
(re-)generate the summary at any time.
Generate reviewer's guide: Comment @sourcery-ai guide on the pull
request to (re-)generate the reviewer's guide at any time.
Resolve all Sourcery comments: Comment @sourcery-ai resolve on the
pull request to resolve all Sourcery comments. Useful if you've already
addressed all the comments and don't want to see them anymore.
Dismiss all Sourcery reviews: Comment @sourcery-ai dismiss on the pull
request to dismiss all existing Sourcery reviews. Especially useful if you
want to start fresh with a new review - don't forget to comment
@sourcery-ai review to trigger a new review!

Customizing Your Experience

Access your dashboard to:

Enable or disable review features such as the Sourcery-generated pull request
summary, the reviewer's guide, and others.
Change the review language.
Add, remove or edit custom review instructions.
Adjust other review settings.

Getting Help

Contact our support team for questions or feedback.
Visit our documentation for detailed guides and information.
Keep in touch with the Sourcery team by following us on X/Twitter, LinkedIn or GitHub.

sourcery-ai

Hey @Saksham-Sirohi - I've reviewed your changes and found some issues that need to be addressed.

Blocking issues:

Undefined isFirefox in popup.js (link)

General comments:

You’re using isFirefox in popup.js without declaring it there—add a Firefox detection (e.g. const isFirefox = /Firefox/.test(navigator.userAgent)) at the top of popup.js so the date‐input workaround actually runs.
The change to manifest.json removes the Chrome background.service_worker section—ensure you conditionally include or maintain the service worker entry so Chrome extensions still load the background script correctly.
Consider extracting repeated browser.storage.local.get/set calls into a small helper so you don’t have to manually swap chrome/browser in every method and reduce duplication.

Prompt for AI Agents

Please address the comments from this code review:
## Overall Comments
- You’re using `isFirefox` in popup.js without declaring it there—add a Firefox detection (e.g. `const isFirefox = /Firefox/.test(navigator.userAgent)`) at the top of popup.js so the date‐input workaround actually runs.
- The change to manifest.json removes the Chrome `background.service_worker` section—ensure you conditionally include or maintain the service worker entry so Chrome extensions still load the background script correctly.
- Consider extracting repeated `browser.storage.local.get/set` calls into a small helper so you don’t have to manually swap `chrome`/`browser` in every method and reduce duplication.

## Individual Comments

### Comment 1
<location> `src/scripts/popup.js:47` </location>
<code_context>

 document.addEventListener('DOMContentLoaded', function() {
+    // Firefox date input fix
+    if (isFirefox) {
+        document.querySelectorAll('input[type="date"]').forEach(input => {
+            if (!input.value) {
</code_context>

<issue_to_address>
Undefined isFirefox in popup.js

`isFirefox` must be defined or imported before use to avoid a ReferenceError.
</issue_to_address>

### Comment 2
<location> `src/scripts/browser-polyfill.js:2` </location>
<code_context>
+// scripts/browser-polyfill.js
+if (typeof browser === "undefined") {
+    window.browser = typeof chrome !== "undefined" ? chrome : {};
+}
</code_context>

<issue_to_address>
Polyfill doesn't override native browser API in Firefox

Firefox's native `browser` object uses promises, but your code expects callbacks. To ensure consistent behavior across browsers, use Mozilla's webextension-polyfill.

Suggested implementation:

```javascript
import browser from 'webextension-polyfill';
window.browser = browser;

```

1. Make sure to install the `webextension-polyfill` package in your project:
   ```
   npm install webextension-polyfill
   ```
2. If your build system does not support ES modules or import syntax in this context, you may need to use a CDN or require statement, or adjust your bundler configuration.
3. Ensure this polyfill is loaded before any other scripts that use the `browser` API.
</issue_to_address>

Sourcery is free for open source - if you like our reviews please consider sharing them ✨

_{Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.}

src/scripts/popup.js

src/scripts/browser-polyfill.js

sourcery-ai

Hey @Saksham-Sirohi - I've reviewed your changes and found some issues that need to be addressed.

Sourcery is free for open source - if you like our reviews please consider sharing them ✨

_{Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.}

Saksham-Sirohi · 2025-06-13T17:20:38Z

@sourcery-ai review

sourcery-ai

Hey @Saksham-Sirohi - I've reviewed your changes - here's some feedback:

Extract the repeated browser.storage.local.get/set logic into a small helper module to reduce duplication and simplify maintenance.
Rename getbrowserData to getBrowserData (or another consistent camelCase) to match the rest of your function naming conventions.
Make sure browser-polyfill.js is loaded before any other scripts (in both popup.html and content scripts) so that the browser namespace is always available.

Prompt for AI Agents

Please address the comments from this code review:
## Overall Comments
- Extract the repeated browser.storage.local.get/set logic into a small helper module to reduce duplication and simplify maintenance.
- Rename `getbrowserData` to `getBrowserData` (or another consistent camelCase) to match the rest of your function naming conventions.
- Make sure `browser-polyfill.js` is loaded before any other scripts (in both popup.html and content scripts) so that the `browser` namespace is always available.

## Individual Comments

### Comment 1
<location> `src/scripts/browser-polyfill.js:2` </location>
<code_context>
+// scripts/browser-polyfill.js
+if (typeof browser === "undefined") {
+    window.browser = typeof chrome !== "undefined" ? chrome : {};
+}
</code_context>

<issue_to_address>
Polyfill only aliases browser to chrome without promise conversion

This approach does not provide promise-based API support. Using `webextension-polyfill` would ensure consistent promise support across browsers.

Suggested implementation:

```javascript
/**
 * scripts/browser-polyfill.js
 * Use the official webextension-polyfill to provide a consistent, promise-based browser API.
 * See: https://github.com/mozilla/webextension-polyfill
 */

// Import the polyfill if not already present
// You must install webextension-polyfill as a dependency: npm install webextension-polyfill

import browser from 'webextension-polyfill';

if (typeof window !== "undefined") {
    window.browser = browser;
}

```

- Ensure that `webextension-polyfill` is installed in your project (`npm install webextension-polyfill`).
- If your build system does not support ES modules or import syntax in this context, you may need to use a different approach to include the polyfill, such as referencing the CDN version or using a bundler.
</issue_to_address>

Sourcery is free for open source - if you like our reviews please consider sharing them ✨

_{Help me be more useful! Please click 👍 or 👎 on each comment and I'll use the feedback to improve your reviews.}

src/scripts/browser-polyfill.js

Preeti9764 · 2025-06-17T03:25:04Z

@Saksham-Sirohi I have tested these changes in the Firefox browser, but the scrum report is not inserted on platforms like Outlook and Yahoo. Check that once. Thanks!

Saksham-Sirohi · 2025-06-17T14:54:51Z

@hpdang, I will open a separate issue for Yahoo and Outlook issue for someone to take

Added cross-browser compatibility for gekko and blink

f40199f

sourcery-ai bot reviewed Jun 13, 2025

View reviewed changes

src/scripts/popup.js Outdated Show resolved Hide resolved

src/scripts/browser-polyfill.js Show resolved Hide resolved

sourcery-ai bot reviewed Jun 13, 2025

View reviewed changes

Saksham-Sirohi force-pushed the firefox-compatibility branch from 6d8056f to 7110418 Compare June 13, 2025 14:57

removed un-necessary background.js

1d5f638

Saksham-Sirohi force-pushed the firefox-compatibility branch from 7110418 to 1d5f638 Compare June 13, 2025 17:19

sourcery-ai bot reviewed Jun 13, 2025

View reviewed changes

src/scripts/browser-polyfill.js Show resolved Hide resolved

hpdang requested review from vedansh-5, hongquan and Preeti9764 June 15, 2025 06:02

Merge branch 'master' into firefox-compatibility

a484bf4

Saksham-Sirohi mentioned this pull request Jun 17, 2025

[Bug] Scrum report not inserted on Outlook and Yahoo in Firefox #135

Open

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Uh oh!

Added cross-browser compatibility for gekko and blink based browsers #123

Added cross-browser compatibility for gekko and blink based browsers #123

Uh oh!

Saksham-Sirohi commented Jun 13, 2025 •

edited by sourcery-ai bot

Loading

Uh oh!

sourcery-ai bot commented Jun 13, 2025 •

edited

Loading

Interacting with Sourcery

Customizing Your Experience

Getting Help

Uh oh!

sourcery-ai bot left a comment

Uh oh!

Uh oh!

Uh oh!

sourcery-ai bot left a comment

Uh oh!

Saksham-Sirohi commented Jun 13, 2025

Uh oh!

sourcery-ai bot left a comment

Uh oh!

Uh oh!

Preeti9764 commented Jun 17, 2025

Uh oh!

Saksham-Sirohi commented Jun 17, 2025

Uh oh!

Uh oh!

Added cross-browser compatibility for gekko and blink based browsers #123

Are you sure you want to change the base?

Added cross-browser compatibility for gekko and blink based browsers #123

Uh oh!

Conversation

Saksham-Sirohi commented Jun 13, 2025 • edited by sourcery-ai bot Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Summary by Sourcery

Uh oh!

sourcery-ai bot commented Jun 13, 2025 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Reviewer's Guide

Sequence Diagram: Unified Storage API Calls

Class Diagram: scrumHelper.js Module Update

Class Diagram: Global browser Object Polyfill

File-Level Changes

Assessment against linked issues

Possibly linked issues

Interacting with Sourcery

Customizing Your Experience

Getting Help

Uh oh!

sourcery-ai bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Uh oh!

sourcery-ai bot left a comment

Choose a reason for hiding this comment

Uh oh!

Saksham-Sirohi commented Jun 13, 2025

Uh oh!

sourcery-ai bot left a comment

Choose a reason for hiding this comment

Uh oh!

Uh oh!

Preeti9764 commented Jun 17, 2025

Uh oh!

Saksham-Sirohi commented Jun 17, 2025

Uh oh!

Uh oh!

Saksham-Sirohi commented Jun 13, 2025 •

edited by sourcery-ai bot

Loading

sourcery-ai bot commented Jun 13, 2025 •

edited

Loading

Class Diagram: `scrumHelper.js` Module Update

Class Diagram: Global `browser` Object Polyfill