Open Bug 1395025 Opened 8 years ago Updated 12 days ago

Extension popup windows with vertically-scrolling content are too narrow

Categories

(WebExtensions :: Frontend, defect, P5)

56 Branch
defect

Tracking

(Not tracked)

UNCONFIRMED

People

(Reporter: paul, Unassigned)

Details

Attachments

(1 file)

User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:56.0) Gecko/20100101 Firefox/56.0 Build ID: 20170825011442 Steps to reproduce: My Chrome extension (IPvFoo) provides a popup window (chrome.pageAction.setPopup()) that lists all the domains associated with a website; this content often needs to scroll vertically. 1. Install https://addons.mozilla.org/en-US/firefox/addon/ipvfoo-pmarks/ 2. Visit a site that makes requests to a lot of domains (e.g. reddit.com) 3. Click IPvFoo's icon to display the popup. Actual results: On Firefox, the popup appears with a vertical scrollbar (good), but also a horizontal scrollbar (bad). On Chrome, the vertical scrollbar causes the popup itself to widen, so that no horizontal scrollbar is required. I've attached a screenshot to highlight the problem.
Component: Untriaged → WebExtensions: Frontend
Product: Firefox → Toolkit
Priority: -- → P5
Product: Toolkit → WebExtensions
The same problem with my extension https://intelligent-speaker.com/

This one is pretty easy to reproduce. If a popup has a fixed width and enough height, horizontal scroll occurs unexpectedly.

See: https://gist.github.com/aduth/e13ebbdaae8b96972a1909b5301dc35b

Download ZIP and "Load Temporary Extension".

This bug still actual

Severity: normal → S3

6 years later, I decided to call this hacky function after each content update. I still see a lot of momentary scrollbar glitching, but it seems to settle on the correct state:

// Workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=1395025
let redrawn = false;
function scrollbarHack() {
  if (typeof browser == "undefined") {
    return;  // nothing to do on Chrome.
  }
  setTimeout(() => {
    const e = document.documentElement;
    if (e.scrollHeight > e.clientHeight) {
      document.body.style.paddingRight = '20px';
    } else if (!redrawn) {
      document.body.classList.toggle('force-redraw');
      redrawn = true;
    }
  }, 200);
}

This is still today if the body has a fixed width. If the vertical scroll appears the horizontal scroll appears too.

You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: