405540 - box elements not rendering over browser.xul vbox with id 'appcontent'

Status: RESOLVED INVALID

(Firefox :: Extension Compatibility, defect)

Description

[Chris Jordan]

User-Agent:       Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O 10.4; en-US; rv:1.9b2pre) Gecko/2007112604 Minefield/3.0b2pre
Build Identifier: Mozilla/5.0 (Macintosh; U; PPC Mac OS X Mach-O 10.4; en-US; rv:1.9b2pre) Gecko/2007112604 Minefield/3.0b2pre

Some Firefox extensions create boxes in order to display content on top of the browser. In a sense, these boxes are used like the new panel element except that they stay visible after they lose focus (ie when the user clicks off of it). In FF2, these boxes are rendered properly over the browser (the vbox with id 'appcontent'). In FF3 though, these boxes are not rendered at all.

Reproducible: Always

Steps to Reproduce:
1.Create a box element
2.Inject the box element into the main-window in the browser.xul

Sample code (Provided by [e-mail] - dev-extension mailing list)
1. define a basic XBL binding (chrome://my-ext/content/bindings/
testbox.xml):
<?xml version="1.0"?>
<bindings
    id="testBindings"
    xmlns="http://www.mozilla.org/xbl"
    xmlns:html="http://www.w3.org/1999/xhtml"
    xmlns:xul="http://www.mozilla.org/keymaster/gatekeeper/
there.is.only.xul"
    xmlns:xbl="http://www.mozilla.org/xbl">
  <binding id="testbox" extends="xul:box">
    <content>
      <xul:vbox style="position: fixed !important;bottom: 5px;left:
5px;width: 100px;height: 100px;border:1px solid green;background-
color: white;" pack="center" align="center" flex="1">
        <xul:label tooltiptext="Label" value="Sample label" />
      </xul:vbox>
    </content>
  </binding>
</bindings>

2. bind via CSS:
testBox
  {
  -moz-binding: url("chrome://my-ext/content/bindings/
testbox.xml#testbox");
  }

3. define a Javascript function to create and inject the element:
    injectTestBox: function(id)
      {
      try
        {
        var box       = document.createElement("testBox");
        box.id        = "testBox-"+id;
        document.getElementById("main-window").appendChild(box);
        }
      catch(e)
        {
        alert("overlay.js - injectTabscope()",e);
        }
      }

4. using a toolbar button defined in overlay.xul, invoke the
Javascript function at will.

Actual Results:  
The box will not render or display itself in FF3

Expected Results:  
The box should render itself like in FF2.

Comment 1

[Mike Connor [:mconnor]]

pretty sure this is a dupe of the views bug where we couldn't use the old anti-phishing UI.  Not looking at all like it'll get fixed in 1.9...

Comment 2

[Chris Jordan]

Can you elaborate Mike? This bug is not present in FireFox 2.x

Comment 4

[Jens J. Parrée]

To ensure compatibility with hundreds of addons, this should seriously be fixed before the relase of the first FF 3 final, because for many addons it is not an option to use menu components which are displayed next to the appcontent area. These addons need to be displayed over the website content.

And, to remove the overlay appcontent feature due to security (e.g. phishing) issues is not a acceptable reason, because addons for FF 3 are now even more restrictive regaring their installation and update-capabilities (e.g. secure updates required).
So if a user decides to install an addon there is enough safty to enable appcontent overlays!

Well, I'm not able to fix this on my on, because of missing in depth knowledge regarding the Core, but who actualy is able (and willing) to do it?

Comment 5

[Mike Shaver (:shaver emeritus)]

Not a dup, per comment 2.  Can someone provide a minimal test case?

Comment 6

[Jens J. Parrée]

I'll provide a simple test addon soon which shows it is working in FF 2 but not in 3RC1.

Comment 7

[Jens J. Parrée]

Actualy this bug is OS independent (we confirmed it on Win, Linux and OS X)!

Comment 8

[Mike Beltzner [:beltzner, not reading bugmail]]

Is this bug CONFIRMED yet? It's not going to block the soon-to-be-shipped Firefox 3.0, but we might want to consider it for a 3.0.x release if it is a significant boon to add-on developers.

I'm a little curious how we didn't catch this in our outreach to add-on authors if it's as significant a barrier as indicated in comment 4.

(adding polvi and chofmann)

Comment 9

[chris hofmann]

don't know if mfinkle might have spotted it in any of his compatibility work...

don't see anything that relates to this problem in http://developer.mozilla.org/en/docs/Updating_extensions_for_Firefox_3

Comment 10

[Mark Finkle (:mfinkle) (use needinfo?)]

I have a vague recollection of this issue, but I can't remember or find the bug associated with it.

All new code should be using <panel> for this kind of feature. <panel noautohide="true" ...> will keep the panel from closing when the user clicks on something else.

Comment 11

[Jens J. Parrée]

Attachment: XUL-Overlay Testcase to compare FF3 and FF 2 behaviour regarding appcontent area

This is a testcase to confirm the xul overlay appcontent area problem in FF 3 which was not present in FF 2.

Comment 12

[Jens J. Parrée]

Attachment: Screenshot in FF 2: XUL-Overlay OK

Comment 13

[Jens J. Parrée]

Attachment: Screenshot in FF 3: XUL-Overlay BUG

Comment 14

[Jens J. Parrée]

I choose a single addon category to look at and I actualy found many addons which use appcontent area overlays. So it should be considered serious for 3.0!

Comment 15

[Mark Finkle (:mfinkle) (use needinfo?)]

(In reply to comment #14)
> I choose a single addon category to look at and I actualy found many addons
> which use appcontent area overlays. So it should be considered serious for 3.0!
> 

<vbox id="appcontent"> stil exists in FF3 so overlaying into it will still work. This bug only affects add-ons that overlay into "appcontent" _and_ attempt to float chrome over content. You are assuming that every add-on that overlays "aapconent" will try to float over content. I don't think that's the case.

Comment 16

[Mike Beltzner [:beltzner, not reading bugmail]]

Roc/Enn: do you recall the bug that disabled this (see comment 2 and the attachments, it also reminds me of the same bug that kept us from rendering the anti-phishing bubble as we did in Fx2) and can you provide an estimate of when this sort of pattern would be supported again? I believe (but am not sure) that it's linked inexorably to the Compositor work (so .. 1.9.1? Mozilla 2?)

Jens: please see comment 10 and comment 14 for solutions that will work in the here and now. 

Comment 17

[Jens J. Parrée]

Well, we are trying to change the behaviour of our addons to be compatible with >= FF3 RC1. We already talked to Jane Finette, Director of Marketing @t mozialla Europe, she told that the RC2 will be shipped at "around the end of this week". We'll keep testing.

May be you should place a note regarding this XUL behaviour in the changelog, so other addon developers are going to also find a workarround solution to this issue.

Comment 18

[Neil Deakin]

It seems that a very specific method where position:fixed in combination with placing the element after the content iframe you are trying to place over allows it to appear over top.

I wasn't aware that this worked before either. In fact, it's quite likely that it was just coincedence that it 'worked' in FF2, and that it shouldn't have done, and that some bug fix (the paint order one possibly) made this so that fixed positioned elements are painted correctly now.

Comment 19

[Mike Beltzner [:beltzner, not reading bugmail]]

Resolving INVALID as per comment 18, adding dev-doc-needed as per comment 17; Sheppy, can you add this to the "What's new in Firefox 3 for XUL developers"?

Comment 20

[Robert O'Callahan (:roc) (email my personal email if necessary)]

position:fixed elements used to get a native widget. We stopped doing that early in Gecko 1.9, which is why that "workaround" stopped working.

Use a XUL <deck> or overflow:auto for now. We won't change those in 1.9.1. After 1.9.1 we should have compositor and these workarounds will no longer be needed.

Comment 21

[Eric Shepherd [:sheppy]]

Somehow I never saw this until today. This is now documented here:

https://developer.mozilla.org/en/Updating_extensions_for_Firefox_3#Changed_boxes