aurelia-hide style does not penetrate shadow DOM about metadata HOT 17 CLOSED

Actually I think this is due to show's behavior in the shadow DOM

from metadata.

@PWKad Could this be that the style used by the show attribute is not penetrating the shadow dom barrier? @mattduffield What is the behavior you are seeing? Is it that all the tabs are visible? But everything else is working?

from metadata.

Yes, you are correct. It is how Rob is describing. When I updated to the
latest, I saw all the tabs visible. Everything else seemed to work just
fine outside of the tabs.

On Mon, May 4, 2015 at 10:37 PM, Rob Eisenberg [email protected]
wrote:

@PWKad https://github.com/PWKad Could this be that the style used by
the show attribute is not penetrating the shadow dom barrier?
@mattduffield https://github.com/mattduffield What is the behavior you
are seeing? Is it that all the tabs are visible? But everything else is
working?

—
Reply to this email directly or view it on GitHub
#11 (comment).

from metadata.

I wonder, if you were to move the style inside the custom element, if that would solve the issue. This presents a really interesting issue, if it is what I think it is.

from metadata.

@mattduffield Can you check in a browser that doesn't support shadow dom and see if everything works correctly for you? For example, safari of FF.

from metadata.

Safari works just fine on the Mac.
FireFox also works fine on the Mac.

On Mon, May 4, 2015 at 10:45 PM, Rob Eisenberg [email protected]
wrote:

@mattduffield https://github.com/mattduffield Can you check in a
browser that doesn't support shadow dom and see if everything works
correctly for you? For example, safari of FF.

—
Reply to this email directly or view it on GitHub
#11 (comment).

from metadata.

I tested this with the attribute commented out....did you want me to test
with it uncommented?

On Mon, May 4, 2015 at 10:50 PM, Matt Duffield [email protected]
wrote:

Safari works just fine on the Mac.
FireFox also works fine on the Mac.

On Mon, May 4, 2015 at 10:45 PM, Rob Eisenberg [email protected]
wrote:

@mattduffield https://github.com/mattduffield Can you check in a
browser that doesn't support shadow dom and see if everything works
correctly for you? For example, safari of FF.

—
Reply to this email directly or view it on GitHub
#11 (comment).

from metadata.

Okay,

I tested both Safari and FireFox using @useShadowDOM and both worked
perfectly but when I opened the same with Chrome, it didn't work.
When I had @useShadowDOM commented out, all three worked fine.

On Mon, May 4, 2015 at 10:51 PM, Matt Duffield [email protected]
wrote:

I tested this with the attribute commented out....did you want me to test
with it uncommented?

On Mon, May 4, 2015 at 10:50 PM, Matt Duffield [email protected]
wrote:

Safari works just fine on the Mac.
FireFox also works fine on the Mac.

On Mon, May 4, 2015 at 10:45 PM, Rob Eisenberg [email protected]
wrote:

@mattduffield https://github.com/mattduffield Can you check in a
browser that doesn't support shadow dom and see if everything works
correctly for you? For example, safari of FF.

—
Reply to this email directly or view it on GitHub
#11 (comment).

from metadata.

So, the show attribute will apply a style to the element based on true/false values. I believe that style is not having an affect because it's not visible inside the shadow DOM. Try using an if binding instead of show and see if that works. That's not a fix for our bug, but might get your code working for now.

from metadata.

Switching to if.bind the tabs become selected but no content is visible
across all three browsers.

On Mon, May 4, 2015 at 10:53 PM, Rob Eisenberg [email protected]
wrote:

So, the show attribute will apply a style to the element based on
true/false values. I believe that style is not having an affect because
it's not visible inside the shadow DOM. Try using an if binding instead
of show and see if that works. That's not a fix for our bug, but might
get your code working for now.

—
Reply to this email directly or view it on GitHub
#11 (comment).

from metadata.

Ah. Switch your content selector on your tab control to select="*" and see
if that fixes that issue.

On Mon, May 4, 2015 at 10:58 PM, Matt Duffield [email protected]
wrote:

Switching to if.bind the tabs become selected but no content is visible
across all three browsers.

On Mon, May 4, 2015 at 10:53 PM, Rob Eisenberg [email protected]
wrote:

So, the show attribute will apply a style to the element based on
true/false values. I believe that style is not having an affect because
it's not visible inside the shadow DOM. Try using an if binding instead
of show and see if that works. That's not a fix for our bug, but might
get your code working for now.

—
Reply to this email directly or view it on GitHub
#11 (comment).

—
Reply to this email directly or view it on GitHub
#11 (comment).

Rob Eisenberg,
President - Blue Spire
www.durandaljs.com

from metadata.

Still using if.binding?

On Mon, May 4, 2015 at 10:59 PM, Rob Eisenberg [email protected]
wrote:

Ah. Switch your content selector on your tab control to select="*" and see
if that fixes that issue.

On Mon, May 4, 2015 at 10:58 PM, Matt Duffield [email protected]
wrote:

Switching to if.bind the tabs become selected but no content is visible
across all three browsers.

On Mon, May 4, 2015 at 10:53 PM, Rob Eisenberg <[email protected]

wrote:

So, the show attribute will apply a style to the element based on
true/false values. I believe that style is not having an affect because
it's not visible inside the shadow DOM. Try using an if binding instead
of show and see if that works. That's not a fix for our bug, but might
get your code working for now.

—
Reply to this email directly or view it on GitHub
#11 (comment).

—
Reply to this email directly or view it on GitHub
#11 (comment).

Rob Eisenberg,
President - Blue Spire
www.durandaljs.com

—
Reply to this email directly or view it on GitHub
#11 (comment).

from metadata.

With if.bind, no change in Chrome.

On Mon, May 4, 2015 at 11:02 PM, Matt Duffield [email protected]
wrote:

Still using if.binding?

On Mon, May 4, 2015 at 10:59 PM, Rob Eisenberg [email protected]
wrote:

Ah. Switch your content selector on your tab control to select="*" and see
if that fixes that issue.

On Mon, May 4, 2015 at 10:58 PM, Matt Duffield [email protected]
wrote:

Switching to if.bind the tabs become selected but no content is visible
across all three browsers.

On Mon, May 4, 2015 at 10:53 PM, Rob Eisenberg <
[email protected]>
wrote:

So, the show attribute will apply a style to the element based on
true/false values. I believe that style is not having an affect
because
it's not visible inside the shadow DOM. Try using an if binding
instead
of show and see if that works. That's not a fix for our bug, but might
get your code working for now.

—
Reply to this email directly or view it on GitHub
<#11 (comment)
.

—
Reply to this email directly or view it on GitHub
#11 (comment).

Rob Eisenberg,
President - Blue Spire
www.durandaljs.com

—
Reply to this email directly or view it on GitHub
#11 (comment).

from metadata.

Ok I've just come back and tested this with show vs if and for me it is working as expected using if.

I think we can log this bug as the fact that show's style does not penetrate the shadow DOM @EisenbergEffect

from metadata.

@mattduffield Can you please change the name of this issue to aurelia-hide style does not penetrate shadow DOM

from metadata.

I have updated the name of this issue. Thanks!

On Tue, May 5, 2015 at 9:17 AM, Patrick Walters [email protected]
wrote:

@mattduffield https://github.com/mattduffield Can you please change the
name of this issue to aurelia-hide style does not penetrate shadow DOM

—
Reply to this email directly or view it on GitHub
#11 (comment).

from metadata.

This has been fixed.

from metadata.