302573 - Cannot place a <browser/> element inside a dynamically created tabpanel

Status: RESOLVED INVALID

(Core :: XUL, defect)

Description

[Tennessee Leeuwenburg]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8b4) Gecko/20050727 Firefox/1.0+
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.8b4) Gecko/20050727 Firefox/1.0+

<?xml version="1.0"?>
<?xml-stylesheet href="chrome://global/skin/" type="text/css"?>

<window 
        title="Bureau of Meteorology Data Viewer"
        orient="vertical"
        xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
        xmlns:html="http://www.w3.org/1999/xhtml"
        align="start"
        id="main_window"
>

        <vbox flex="1">
                <hbox style="margin: 15px; height: 100%; width: 100%;"
id="applicationwindow">        
                        <tabbox id="controls" height="400" width="400">
                                <tabs id="tabLabels">
                                        <tab label="Data Chooser"/>
                                </tabs>
                        
                                <tabpanels id="tabPanels">
                                        <tabpanel id="data-tab">
                                                <button label="Launch New"
id="btnLauncher" />
                                        </tabpanel>                            
                          
                                </tabpanels>
                        </tabbox>
                </hbox>
        </vbox>

        <script type="text/javascript;e4x=1"> 
        <![CDATA[
                var mainWindow = document.getElementById("main_window");
                mainWindow.addEventListener("load", doKungFu(), false);
                
                function doKungFu() {
                        var btnLauncher=document.getElementById("btnLauncher");
                        btnLauncher.addEventListener("command", tabOpener, true);
                }
                
                function tabOpener(event) {
                        event.preventDefault();
                        
                        var href = "http://www.google.com";
                        var tab = document.createElement("tab");
                        tab.setAttribute("label", "Hello, Tab!");
                        
                        var tabPanel = document.createElement("tabpanel");
                        var browser = document.createElement("browser");
                        browser.setAttribute("flex", "1");
                        browser.setAttribute("style", "background: #000;");
                        
                        var tabs = document.getElementById("tabLabels");
                        tabs.appendChild(tab);
        
                        var panels = document.getElementById("tabPanels");
                        
                        alert("0");                
                        panels.appendChild(tabPanel);  
                        
                        alert("1");
                        
                        var button = document.createElement("button");
                        button.setAttribute("label", "FOO");
                        tabPanel.appendChild(button);
                        
                        alert("2");
                        
                        var boxFoo = document.createElement("vbox");
                        
                        alert("2.5");
                        
                        tabPanel.appendChild(boxFoo);
        
                        alert("3");
                        
                        browser.setAttribute("src", "http://www.google.com.au/");
                        browser.setAttribute("type", "content");
                        browser.setAttribute("message", "true");
                        
                        
                        boxFoo.appendChild(browser);                
                        
                        alert("4");
                        
                        browser.src = "http://www.google.com";
                        
                        alert(browser.src);
                        alert("hello, world!");
                }

        ]]>
        
        </script>

</window>



Reproducible: Always

Steps to Reproduce:
Push the button to launch a new tab
Actual Results:  
A new tab is created with a button in it, labelled "Foo"

Expected Results:  
A new tab should be created with a button in it labelled "Foo" and also a
browser showing the google homepage.

Additionally, there is no output in the Javascript console highlighting any
exception/error

This is moderately important to me. It was my preferred way to implement some
very desireable functionality. I might be able to work around it, but it would
subtract from the quality of my code.

Comment 1

[Boris Zbarsky [:bzbarsky]]

>                    browser.setAttribute("src", "http://www.google.com.au/");

This doesn't work very well due to bug 265086

Comment 2

[[e-mail]]

Try puttting flex="1" on your tabpanels and vbox.