tab container gone wonkey

[kenfeldt]

I have an application with tabs that was working with dojo 1.10.6, but broke with dojo 1.11.2 and beyond...

The problem involves some mathjax (a mathematic rendering engine) that is dynamically building one of the tabs.

At: https://read.electricbook.net/book/guest/1
  - click example problem 1 - 1 (along left side) --- actually any of the sample problems will do
  - you will see the mathjax message along the bottom of a 'curtain' that is raised when all rendering is complete
  - you see three tabs - Problem Statement, Solution, and e-Blink

That is how it is supposed to work (dojo 1.10.6)

Try the same thing with https://staging.electricbook.net/book/guest/1
 - you see the tabs start to draw OK, but once the math rendering is complete, the tab content seems to be shifted up signficantly. By clicking the third tab (e-Blink) all three tab content areas snap back into place

I will be happy to make some type of change to the code - but I thought I would just ask the question to see if anyone else has this problem.


Oh and....

The dojo page http://dojotoolkit.org/download/ identifies the googleapis server for 1.11.3 as the script reference to use in pages that want
   to download from a remote server
The 'other downloads page' (http://download.dojotoolkit.org/) states 1.12.1 is the latest stable release, and as the latest prerelease
The google api download page has neither - it holds the latest as 1.11.2

????

Will it be safe to point my code to http://download.dojotoolkit.org/release-1.12.1/dojo-release-1.12.1/   ?

Thanks




What is the


--
Dojo Toolkit: http://dojotoolkit.org/
Tutorials: http://dojotoolkit.org/documentation/

[hidden email]
To unsubscribe, visit: http://mail.dojotoolkit.org/mailman/listinfo/dojo-interest

[dylanks]

Regarding the second part of the question, basically Google's CDN often
lags behind our releases unfortunately.

1.12.1 is the latest stable release, with 1.11.3, 1.10.7, 1.9.10,
1.8.13, 1.7.11, 1.6.4, 1.5.5, and 1.4.7 released at the same time with
any fixes that were backported that do not cause breaking API changes
for older releases.

We will probably have a 1.12.2, 1.11.4, etc. near the end of the month.

If you do not want to wait for Google to make updates, we would
recommend using rawgit instead of linking directly to a release on our
servers, https://rawgit.com/ . For example, pointing to dojo.js as
https://cdn.rawgit.com/dojo/dojo/1.12.1/dojo.js

For the first part of your question, I am seeing the same issue with
your example, but I've not had a chance to track down why there's an issue.

My best guess is that this fix,
https://github.com/dojo/dojo/commit/b2b42c8b860423eb4f7a8a79b45a19ffda42b488
, may have introduced some oddity in how the geometry is being
calculated (at least that's the only change that comes to mind that
might be having this impact). Unfortunately though, this change wasn't
in 1.11.2, but only in the 1.12.x and newer codebase.

Regards,
-Dylan

on 1/12/17, 21:15 (GMT-07:00) Ken Feldt said the following:

> I have an application with tabs that was working with dojo 1.10.6, but
> broke with dojo 1.11.2 and beyond...
>
> The problem involves some mathjax (a mathematic rendering engine) that
> is dynamically building one of the tabs.
>
> At: https://read.electricbook.net/book/guest/1
>   - click example problem 1 - 1 (along left side) --- actually any of
> the sample problems will do
>   - you will see the mathjax message along the bottom of a 'curtain'
> that is raised when all rendering is complete
>   - you see three tabs - Problem Statement, Solution, and e-Blink
>
> That is how it is supposed to work (dojo 1.10.6)
>
> Try the same thing with https://staging.electricbook.net/book/guest/1
>  - you see the tabs start to draw OK, but once the math rendering is
> complete, the tab content seems to be shifted up signficantly. By
> clicking the third tab (e-Blink) all three tab content areas snap back
> into place
>
> I will be happy to make some type of change to the code - but I thought
> I would just ask the question to see if anyone else has this problem.
>
>
> Oh and....
>
> The dojo page http://dojotoolkit.org/download/ identifies the googleapis
> server for 1.11.3 as the script reference to use in pages that want
>    to download from a remote server
> The 'other downloads page' (http://download.dojotoolkit.org/) states
> 1.12.1 is the latest stable release, /and/ as the latest prerelease
> The google api download page has neither - it holds the latest as 1.11.2
>
> ????
>
> Will it be safe to point my code to
> http://download.dojotoolkit.org/release-1.12.1/dojo-release-1.12.1/   ?
>
> Thanks
>
>
>
>
> What is the
>
> --
> Electric Book Company, LLC
> /Turning Content Into Community/
> 804-514-6149
> read.electricbook.net (Calculus Review)
> www.group-study.net (public site)
> www.electricbook.net (company site)
>

--
Dylan Schiemann
Dojo and JS support: http://sitepen.com/support/
--
Dojo Toolkit: http://dojotoolkit.org/
Tutorials: http://dojotoolkit.org/documentation/

[hidden email]
To unsubscribe, visit: http://mail.dojotoolkit.org/mailman/listinfo/dojo-interest

[neekfenwick]

I've run into a similar problem, I think, in my case a StackContainer
child is offset higher than it should be.  We actually have a
StackContainer inside a StackContainer and quite complicated layout.

It looks like it stems from https://bugs.dojotoolkit.org/ticket/18612 
where Bill mentions a "a failed attempt to use visibility:hidden rather
than display:none. However, the failure was due to a problem in IE6 (and
likely IE7), which AFAICT doesn't happen in IE8+, so I think we are OK"

What I'm finding is that using visibility:hidden for stackcontainer
children leaves them in the layout, still taking up space (of course,
that's what visibility:hidden does) which means having several children
with dijitHiden and one with dijitVisible means the 'hidden' ones are
still jostling the visible one for space.  The intention, at least in
our case, is to have the 'hidden' ones completely removed from layout
and the visible one filling available space.

I can fix your app by selecting the dijitHidden elements and editing the
dijitHiden style to have 'display: none' instead of visibility:hidden.  
You have one TabPaneWrapper which contains your three tab contents, the
Statement, Solution and e-Blink.  Once the Solution and e-Blink ones are
actually removed from layout, the Statement one lays out correctly.

Can someone else weigh in on why dijitHidden is using visibility:hidden
and how this is not supposed to break layout of things like TabContainer
or StackContainer's children?  This seems to have been introduced in
1.11.x so it's not like this is a new situation.

Nick
--
Dojo Toolkit: http://dojotoolkit.org/
Tutorials: http://dojotoolkit.org/documentation/

[hidden email]
To unsubscribe, visit: http://mail.dojotoolkit.org/mailman/listinfo/dojo-interest

[neekfenwick]

I cannot reproduce the error with a test case, I tried using
TabContainer and StackContainer.  However, our production app definitely
has a similar problem to Ken's.

For now I'm having to put this into our main CSS file:

     .dijitHidden {
         visibility: inherit;
         display: none;
     }
     .dijitVisible {
         visibility: inherit;
     }

Hopefully someone can see from Ken's online example what the problem
is?  I can see now that the position:absolute is supposed to remove the
elements from the document flow and visibility:hidden makes them
invisible, which certainly does work in the test cases I created, but
fails for me and Ken in our production app.

Nick
--
Dojo Toolkit: http://dojotoolkit.org/
Tutorials: http://dojotoolkit.org/documentation/

[hidden email]
To unsubscribe, visit: http://mail.dojotoolkit.org/mailman/listinfo/dojo-interest