Failing for two quick consequent transitions and back

[TomasAgoston]

We are experiencing the following behavior:

When "navigating" through two transitions of templates (either by clicking / tapping, or by pushing browser history) and navigating then back, the transition mechanism fails.

I am not 100% sure of the following, but this is our hypothesis what is going on.

Let us assume that transitions are from template A to template B and teamplate B to template C and back from teamplate C to template B.

B and C are not instanced templates yet.

The first transition starts, sets B template 'if' property to true. No instance is 'materialized' yet. The second transition immediatelly cancels the first transition. Wants to start from B, but still hasn't instance of template B. B does not get handled correctly somehow in the cleanup, C is displayed though. But navigating (any time later) back from C to B fails.

This is the current entry page activation.

    // start entryPage activation
    this.lazy._setSelectedItem(this.entryPage);
    if (this.isTemplate(this.entryPage)) {
      this.entryPage.addEventListener('dom-change', this._boundDomChange);
      if (this.entryPage.if)
        console.warn('transitioning to already showing template');
      this.entryPage.if = true; // generate the dom
    }
    ...

On transitioning back from C to B, the entryPage (template B) has the "if" property stil set to true, the 'dom-change' is not fired, the _boundDomChange() method is not called.

We would suggest this change as an 'optimistic' approach to always fire the transition:

    // start entryPage activation
    this.lazy._setSelectedItem(this.entryPage);
    if (this.isTemplate(this.entryPage)) {
      if (this.entryPage.if) {
        console.warn('transitioning to already showing template');
        this._boundDomChange();
      }
      else {
        this.entryPage.addEventListener('dom-change', this._boundDomChange);
        this.entryPage.if = true; // generate the dom
      }
    }

This works for us.

Might need correct handling of stopped transition "not yet materialized" pages though.

[atotic]

Thanks for the investigation. The cause of the problem is that B->C transition does not set B.if to false. Any chance you can fix this? My guess is that fiddling with this code should do it:

cleanup: function() {
....
 if (this.exitInstance) {
      if (this.isTemplate(this.exitPage))
        this.exitPage.if = false;
      Polymer.dom(this.exitInstance).classList.remove('neon-animating');
    }
...

This might be the right fix:

if (this.isTemplate(this.exitPage))
    this.exitPage.if = false;
if (this.exitInstance)
    Polymer.dom(this.exitInstance).classList.remove('neon-animating');

But I can't tell, I do not have an example running.

I am no longer actively using this code, so creating a fix is up to you. If you'd like to send me a pull request with whatever solution works best for you, I'll be happy to take the patch.