ayo/lion
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

fix(steps): steps.current should be update before @enter

Browse source
This commit is contained in:
Thomas Allmer 2019-10-24 10:35:19 +02:00 committed by Thomas Allmer
parent 610b908f62
commit ebe2bc1aad
2 changed files with 36 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

3
packages/steps/src/LionSteps.js
View file

@ -110,13 +110,14 @@ export class LionSteps extends ObserverMixin(LionLitElement) {
const toStep = { number: newCurrent, element: newStepElement };
oldStepElement.leave();
newStepElement.enter();
if (this.current !== newCurrent) {
this._internalCurrentSync = true;
this.current = newCurrent;
}
newStepElement.enter();
this._dispatchTransitionEvent(fromStep, toStep);
}

34
packages/steps/test/lion-steps.test.js
View file

@ -158,6 +158,40 @@ describe('lion-steps', () => {
});
});
describe('events', () => {
it('will trigger lion-step @leave event before changing .current', async () => {
let currentInLeaveEvent;
const onLeave = ev => {
currentInLeaveEvent = ev.target.controller.current;
};
const el = await fixture(html`
<lion-steps>
<lion-step @leave=${onLeave}>Step 0</lion-step>
<lion-step>Step 1</lion-step>
<lion-step>Step 2</lion-step>
</lion-steps>
`);
el.next();
expect(currentInLeaveEvent).to.equal(0);
});
it('will trigger lion-step @enter event after changing .current', async () => {
let currentInEnterEvent;
const onEnter = ev => {
currentInEnterEvent = ev.target.controller.current;
};
const el = await fixture(html`
<lion-steps>
<lion-step>Step 0</lion-step>
<lion-step @enter=${onEnter}> Step 1</lion-step>
<lion-step>Step 2</lion-step>
</lion-steps>
`);
el.next();
expect(currentInEnterEvent).to.equal(1);
});
});
describe('workflow with data and conditions', () => {
it('navigates to the next step which passes the condition', async () => {
const el = await fixture(html`