Glance does not work on certain websites

Tanza3D commented 2 weeks ago

Captchas

[X] I have read the instructions.
[X] I have searched existing issues and avoided creating duplicates.
[X] I am not filing an enhancement request.

What happened?

Some websites will hook into the click of anchor elements, e.g. UNTONE Music. When you ctrl+click on links on these pages, it'll open the page in the Glance popup but also on the page itself

https://github.com/user-attachments/assets/52f96b2c-d418-4fef-955f-8c1f1acff538

I'd assume this is partially an issue with the site code itself, but I feel that other sites would probably take a similar approach, so might be best fixed on the browser side of things

Reproducible?

[X] I have checked that this issue cannot be reproduced on Mozilla Firefox.

Version

1.0.1-a.16 - video is of a.15 but it happens on both

What platform are you seeing the problem on?

Linux

Relevant log output

No response

RayZ3R0 commented 2 weeks ago

Yeah that's the website causing issues sadly. If the website has made it so links are always opened in new tabs that won't work with glance yet

theherk commented 1 week ago

This issue doesn't seem limited to sites forcing new tabs. I run into it with Gitlab CI. I commonly (w/Arc) opened jobs in a pipeline in the preview window popup. Trying to do the same with Glance does not work. If the link is clicked it opens in the same tab, if ⇧-clicked it opens in a new window, and if ⌘-clicked it opens in a new tab. But is ⌥-clicked nothing happens.

The html for one such button is:

<div id="generate-prod-2686163" data-qa-selector="job_item_container" class="ci-job-component gl-display-flex gl-justify-content-space-between gl-pipeline-job-width gl-transition-duration-slow gl-transition-timing-function-ease">
  <a title="generate-prod - passed" data-testid="job-with-link" data-qa-selector="job_link" href="/client-deploy/-/jobs/14633216" class="gl-link js-pipeline-graph-job-link menu-item gl-text-gray-900 gl-active-text-decoration-none gl-focus-text-decoration-none gl-hover-text-decoration-none gl-w-full gl-p-3 gl-border-gray-100 gl-border-solid gl-border-1 gl-bg-white gl-rounded-7 gl-hover-bg-gray-50 gl-focus-bg-gray-50 gl-hover-text-gray-900 gl-focus-text-gray-900 gl-hover-border-gray-200 gl-focus-border-gray-200 job-success">
    <div class="gl-display-flex gl-align-items-center gl-flex-grow-1">
      <span class="gl-line-height-0 ci-status-icon ci-status-icon-success gl-rounded-full gl-justify-content-center gl-line-height-0" style="height: 24px; width: 24px;">
        <svg data-testid="status_success-icon" role="img" aria-label="status_success" class="gl-icon s24">
          <use href="/assets/icons-b25b55b72e1a86a9ca8055a5c421aae9b89fc86363fa02e2109034d756e56d28.svg#status_success"></use>
        </svg>
      </span>
      <div class="gl-pl-3 gl-pr-3 gl-display-flex gl-flex-direction-column gl-pipeline-job-width">
        <div class="gl-text-truncate gl-pr-9 gl-line-height-normal">generate-prod</div>
      </div>
    </div>
  </a>
  <button id="js-ci-action-/client-deploy/-/jobs/14633216/retry" data-testid="ci-action-component" type="button" class="btn js-ci-action gl-ci-action-icon-container ci-action-icon-container ci-action-icon-wrapper gl-display-flex gl-align-items-center gl-justify-content-center gl-mr-1 btn-default btn-md gl-button retry js-icon-retry" data-qa-selector="job_action_button">
    <span class="gl-button-text">
      <div title="Run again" data-testid="ci-action-icon-tooltip-wrapper" class="gl-display-flex gl-align-items-center gl-justify-content-center gl-h-full">
        <svg data-testid="retry-icon" role="img" aria-label="retry" class="gl-mr-0! gl-icon s16">
          <use href="/assets/icons-b25b55b72e1a86a9ca8055a5c421aae9b89fc86363fa02e2109034d756e56d28.svg#retry">
          </use>
        </svg>
      </div>
    </span>
  </button>
</div>

zen-browser / desktop