#1806 closed defect (fixed)
Problem with dojo layouts with Safari and FF
| Reported by: | guest | Owned by: | koranteng |
|---|---|---|---|
| Priority: | high | Milestone: | 0.9 |
| Component: | Dijit | Version: | 0.4 |
| Keywords: | Cc: | [email protected]… | |
| Blocked By: | Blocking: |
Description
Problem 1: Crashes Safari
Description: just surf with safari with that content and it will crash. Does not affect webkit nightly
Problem 2: Layout is broken
Description: Changing size in FF, Safari, Opera will make scrollbars to appear and layout to go crazy.. More you change size of browser, more it's not ok.. Most of the time layout is not correct after the page is parsed.
Problem 3: Totally broken in latest revision
I tested this problem with about 2-3months old revision and todays revision from trunk.
<html>
<head>
<title>Tab+SplitContainer test</title>
</head>
<script type="text/javascript" src="trunk/dojo.js"></script>
<script type="text/javascript">
dojo.require("dojo.widget.ContentPane");
dojo.require("dojo.widget.LayoutContainer");
dojo.require("dojo.widget.TabContainer");
dojo.require("dojo.widget.SplitContainer");
</script>
<style>
html, body { width: 100%; height: 100%; }
</style>
<body>
<div dojoType="SplitContainer" style="width: 100%; height: 100%;">
<div dojoType="ContentPane">con 1</div>
<div dojoType="LayoutContainer">
<div dojoType="TabContainer" layoutAlign="client">
<div dojoType="ContentPane" label="tab1">Tab 1</div>
<div dojoType="SplitContainer" label="tab 2">
<div dojoType="ContentPane">Split 1</div>
<div dojoType="ContentPane">Split 2</div>
</div>
</div>
</div>
</div>
</body>
</html>
Test code also in http://joose.iki.fi/dojo/test-tabs5.html (older revision) Test code also in http://joose.iki.fi/dojo/test-tabs6.html (latest revision)
Change History (9)
comment:1 Changed 14 years ago by
comment:2 Changed 14 years ago by
For #3 root cause is probably that postMixInProperties() wasn't calling the superclass. I'll test that and check it in soon.
comment:3 Changed 14 years ago by
I added some missing postMixInProperties calls, so issue #3 is fixed, but the test code above still crashes Safari.
comment:4 Changed 14 years ago by
The problem is that TabContainer?.onResized() calls dojo.widget.html.layout() which calls TabContainer?.onResized(), and so forth. I put a lame busy flag inside onResized and the problem went away, but I doubt that's the right way to fix this.
comment:5 Changed 14 years ago by
I didn't detect any infinite recursion; here's what I saw. This testcase has deeply nested widgets: SplitContainer? --> LayoutContainer? --> TabContainer? --> ContentPane?
- when the TabContainer? is initialized, it queries it's own size, then sizes the ContentPane? accordingly. But there is no size specified for the TabContainer?, so it's essentially a random size.
- when the LayoutContainer? is initialized, it queries it's own size, then sizes the TabContainer? accordingly, which in turn sizes the ContentPane?. But there is no size specified for the LayoutContainer? either.
- when the SplitContainer? is initialized, it queries it's own size, then sizes the LayoutContainer?, which in turn sizes the TabContainer?, which in turn sizes the ContentPane?.
All this resizing is just too much for Safari to handle, and it crashes.
It would be good if no widgets did any sizing until the top widget was instantiated. Except for widgets created programatically, or downloaded into a ContentPane? via href attribute, etc. Hmm, not sure what to do here.
comment:6 Changed 14 years ago by
| Milestone: | 0.4.1 → 0.5 |
|---|
I'm gonna punt this to 0.5 (at least). I think we could workaround the safari bugs by redesigning widget instantiation to be more efficient, maybe being top down instead of bottom up, but that's much too major a change for 0.4.1.
Actually, even saying "top-down" is a vast oversimplification. Let's look at an example in pseudo-code:
<LayoutContainer style="width:500px; height:500px"> <DatePicker layoutAlign=top/> <ContentPane layoutAlign=client/> </LayoutContainer>
In this case, the efficient instantiation of these objects is:
- create DatePicker?
- create LayoutContainer?
- LayoutContainer? queries it's own size plus DatePicker?'s size
- LayoutContainer? gives remaining space to ContentPane?
- create ContentPane?
comment:7 Changed 14 years ago by
Here's another example that crashes Safari Version 2.0.4 (419.3) - Wish I had time to investigate it more but I think that would piss off my boss. Maybe it'll shed some light on something.
<html>
<head>
<script type="text/javascript">
var djConfig = { isDebug: true };
</script>
<script type="text/javascript" src="dojo.js"></script>
<script type="text/javascript">
dojo.require("dojo.widget.TabContainer");
dojo.require("dojo.widget.ContentPane");
dojo.require("dojo.widget.LinkPane");
dojo.hostenv.writeIncludes();
</script>
</head>
<body>
<div id="mainTabContainer" dojoType="TabContainer" style="width:100%; height:100%">
<div id="tabTest1" dojoType="ContentPane" label="Test">
<div style="float:right;padding:10px">
</div>
</div>
<a dojoType="LinkPane" href="" id="tabTest2">Test2</a>
</div>
</body>
</html>
comment:8 Changed 14 years ago by
| Component: | Widgets → Dijit |
|---|---|
| Owner: | changed from bill to koranteng |
Not supporting Safari 2.0.4, but worth checking to make sure this works on Webkit and on FF2.0.
comment:9 Changed 14 years ago by
| Resolution: | → fixed |
|---|---|
| Status: | new → closed |
Found & fixed problem #3 (broken from revision 6390. Simple fix here it is:
SplitContainer.js: - postMixInProperties: function(){ - this.isHorizontal = (this.orientation == 'horizontal'); - }, fillInTemplate: function(){ .... this.paneWidth = content.width; this.paneHeight = content.height; + this.isHorizontal = (this.orientation == 'horizontal');So, remove PostMixProperties? and move the line "this.isHorizontal = (this.orientation == 'horizontal');" to postCreate();