Double-load behavior for included wizard including additional pages

  • 1
  • Problem
  • Updated 2 years ago
Here's the scenario:

Primary page has tabset with defer rendering and lazy load include components on every tab.
 - Tab contains a page include, set to lazy load
 -- included page includes a wizard, set to defer rendering
 --- all three wizard steps contain page include components, and are set to lazy load those components.

It appears that in this scenario, skuid is attempting to load the page include of the first step of the wizard at least twice.
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb

Posted 2 years ago

  • 1
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb
bump
Photo of Amy Dewaal

Amy Dewaal, Official Rep

  • 8,200 Points 5k badge 2x thumb
Matt,

What version of Skuid is this on?

Thanks!
Amy
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb
8.15.15
Photo of Amy Dewaal

Amy Dewaal, Official Rep

  • 8,200 Points 5k badge 2x thumb
How are you loading your page includes in the tabset (and your page includes in the page include)? Is it through a snippet? 
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb
no snippets, just the standard load and lazy-load behavior of the tabset and wizard.

have you been able to replicate the scenario described in the OP?
Photo of Amy Dewaal

Amy Dewaal, Official Rep

  • 8,200 Points 5k badge 2x thumb
Matt,

I think I have my setup correct now, but I'm not sure if I'm seeing the problem that you are. I have everything set to defer rendering and lazy load (except the page include on the first tab, which I let load on page load). I do see a Loading message twice on that first tab, but I think that's expected behavior. The first loading message is for the page include on the tab to load, and the second loading message is where the page include in the included page / wizard is loading. Is that what you're seeing, or are you seeing something different?

Thanks!
Amy
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb
Amy,

That all sounds right, except that the wizard I'm having trouble with is not in the first tab of the tabset:

Tab 1
Tab 2
  - Page Include (lazy load)
    -Wizard Step 1
      -Page Include (not lazy load)
         -Stock Components
         -Awesome Custom Signature Component (attempting to render twice)
    -Wizard Step 2 
      -Page Include (lazy load)
        -Stock Components
        -Awesome Custom Signature Component (working fine)
Tab 3


I have the tabset and wizard both deferring rendering, but the page include in the first step of the wizard is not set to lazy load because if I do, the include doesn't want to render. However, Skuid is attempting to load my custom component on wizard step 1 twice (and perhaps all of the components, but I can't really tell). I have a console.log call at the beginning of my component, and it's being called twice.
I have the same component in the page include in the second wizard step, and it's rendering only once (and therefore working just fine).

Can you try making a simple custom component which just logs its own rendering and inserting it into your test setup?
Photo of Amy Dewaal

Amy Dewaal, Official Rep

  • 8,200 Points 5k badge 2x thumb
Matt,

I think I've got it! I can see the same behavior on my custom component, where it's logging more than once. One last question for you - Can you visually see the component rendering more than once or can you just tell from the console.log?

Thanks!
Amy
Photo of Matt Sones

Matt Sones, Champion

  • 31,478 Points 20k badge 2x thumb
Perhaps it's because my component is poorly designed, but it doesn't work correctly when it renders twice, which is what started me on this process. I think it's because I'm using some jQuery #selectors, and the double-rendering confuses things. If the page is loading slowly, I can actually see it render twice (the first time it looks fine, and then it gets messed up).