# Report Chrome Extension Issues

### Overview <a href="#overview" id="overview"></a>

* Extension bugs are more difficult to troubleshoot comparing to the web app (aka dashboard). This is due to the fact that the extension is running in a “foreign” playground - the user’s environment - while the web app is running in its own playground
* We may not be able to reproduce scenarios in an accurate fashion because the users often work in their secure environment, which may not be available to us
* The extension lives in 3 different “zones”:
  * Popup - appears when clicking on the extension icon
  * Content - the metrics overlay and the manual test widget
  * Service worker (Background) - the data flowing between the extension and SL BE
* The **content** lives inside the host page, meaning it can impact anything inside the page (and conversely, the page can affect the extension’s appearance and behavior)
* The extension communicates with our BE only thru the service worker (background)

### Identify the installed version <a href="#identify-the-installed-version" id="identify-the-installed-version"></a>

* Find it in the extensions page (**chrome://extensions/**). Below it shows that version 1.11.7 is installed

  <figure><img src="https://4057366433-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAjqTCMRYvHhDgsdPLUnc%2Fuploads%2FfLPIgdcweQyCardo6HQm%2Fimage-20221019-110507.png?alt=media&#x26;token=e091818c-fe7f-4c58-9c68-827dfc45bb01" alt=""><figcaption><p>Extension version in the browser’s extensions page</p></figcaption></figure>
* You can also check the installed version when clicking on the extension icon from the browser’s toolbar:

  <figure><img src="https://4057366433-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAjqTCMRYvHhDgsdPLUnc%2Fuploads%2Fc99giBYhkPeh7gjG7rez%2Fimage-20221019-111019.png?alt=media&#x26;token=5f5ec144-9741-423c-91c9-20d15b96410b" alt=""><figcaption><p>Extension version appears in its menu</p></figcaption></figure>
* Verify that the latest extension version is installed

### Open the windows where the extension related data is visible <a href="#open-the-windows-where-the-extension-related-data-is-visible" id="open-the-windows-where-the-extension-related-data-is-visible"></a>

* Open the browser’s **Developer Tools** of the page hosting the extension. It is either
  * The SCM page where the extension shows metrics overlay (e.g. Pull Request)
  * The page where the user is running a manual test

    <figure><img src="https://4057366433-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAjqTCMRYvHhDgsdPLUnc%2Fuploads%2FjkyVevHsJvkpsvoC6Dbx%2Fimage-20221019-112324.png?alt=media&#x26;token=44ed628a-c907-4e82-854e-48dfdeca11d0" alt=""><figcaption><p>Developer tools menu item (in Chrome for Windows)</p></figcaption></figure>
* In the extensions page (**chrome://extensions/**) switch on **Developer mode** (located in the top right corner of the page)

  <figure><img src="https://4057366433-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAjqTCMRYvHhDgsdPLUnc%2Fuploads%2FNG1YtxBJ7gnUitMJD3Yn%2Fimage-20191110-115458.png?alt=media&#x26;token=00c727db-530a-4987-a43a-1b8830cd731d" alt=""><figcaption><p>Switching on Developer mode</p></figcaption></figure>
* click the **service worker** link found in the extension box

  <figure><img src="https://4057366433-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAjqTCMRYvHhDgsdPLUnc%2Fuploads%2FML73BkpOr0IBQshefQRa%2Fimage-20221019-110817.png?alt=media&#x26;token=6a52ecff-1ba5-45d6-9841-6cc7baf4922e" alt=""><figcaption><p>Link to the extension’s service worker</p></figcaption></figure>

### Collect helpful data <a href="#collect-helpful-data" id="collect-helpful-data"></a>

* The **Console** tab of the host page **Developer Tools** may contain helpful data. Especially when there is an error

  <figure><img src="https://4057366433-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAjqTCMRYvHhDgsdPLUnc%2Fuploads%2FOwaCloPfnEGyHeXna0Ti%2Fimage-20221019-112751.png?alt=media&#x26;token=264cb308-4aca-4218-be52-7c297fb99935" alt=""><figcaption><p>The <strong>Console</strong> tab of the <strong>Developer Tools</strong></p></figcaption></figure>
* The Network tab of the service worker.Select the **Fetch/XHR** list as illustrated below

  <figure><img src="https://4057366433-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAjqTCMRYvHhDgsdPLUnc%2Fuploads%2F2b2Qt2dVOyDs9dpt5WfL%2Fimage-20221019-113122.png?alt=media&#x26;token=1c2fa714-57c0-47e4-b9a7-aafac34537d0" alt=""><figcaption><p>The <strong>Network</strong> tab of the extension’s service worker</p></figcaption></figure>
* Right clicking on any request in the list will show the following menu where the user can copy anything related to the selected request and send it to us for further investigation. Provide us with the content of both options **Copy link address** and **Copy response**.

  <figure><img src="https://4057366433-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FAjqTCMRYvHhDgsdPLUnc%2Fuploads%2Fcb5EsFXVx3fA8m9ob7f3%2Fimage-20191110-120629.png?alt=media&#x26;token=b4b61c5d-55d2-4707-96f0-cf44d6fbdbbc" alt=""><figcaption><p>Network resource menu</p></figcaption></figure>
