Skip to content

Commit 7c45ad4

Browse files
committed
Did I reproduce a different issue?
1 parent 117130d commit 7c45ad4

File tree

1 file changed

+45
-9
lines changed
  • packages/@glimmer-workspace/integration-tests/lib/suites

1 file changed

+45
-9
lines changed

packages/@glimmer-workspace/integration-tests/lib/suites/components.ts

Lines changed: 45 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -866,7 +866,7 @@ export class GlimmerishComponents extends RenderTest {
866866
@test({ kind: 'glimmer' }) 'destruction is not autotracked'() {
867867
class State {
868868
@tracked willDestroyCalls = 0;
869-
increment = () => this.willDestroyCalls++;
869+
incrementWillDestroy = () => this.willDestroyCalls++;
870870
}
871871
let state = new State();
872872
class Child extends GlimmerishComponent {
@@ -884,26 +884,62 @@ export class GlimmerishComponents extends RenderTest {
884884
this.registerComponent(
885885
'Glimmer',
886886
'Example',
887-
`
888-
<p>willDestroyCalls: {{@willDestroyCalls}}</p>
887+
`<p>willDestroyCalls: {{@willDestroyCalls}}</p>
889888
<button {{on "click" this.toggleChild}}>Toggle child</button>
890889
891890
{{#if this.showChild}}
892891
<Child @incrementWillDestroy={{@incrementWillDestroy}} />
893-
{{/if}}
894-
`,
892+
{{/if}}`,
895893
Example
896894
);
897895

898896
this.render(
899-
'<Example @incrementWillDestroy={{this.state.increment}} @willDestroyCalls={{this.state.willDestroyCalls}} />',
897+
`<Example
898+
@incrementWillDestroy={{this.state.incrementWillDestroy}}
899+
@willDestroyCalls={{this.state.willDestroyCalls}}
900+
/>`,
900901
{ state }
901902
);
902903

903-
this.assert.strictEqual(this.takeSnapshot(), '..');
904-
this.assert.strictEqual(state.willDestroyCalls, 0);
905-
this.assertHTML('', 'p', 'destroys correctly');
904+
// Helper because assertHTML is invisible-character sensitive, and this test doesn't care about
905+
// that.
906+
// Where is qunit-dom?
907+
let output = (calls: number, hasChild: boolean) => {
908+
if (hasChild) {
909+
return `<p>willDestroyCalls: ${calls}</p>
910+
<button>Toggle child</button>
906911
912+
a child
913+
`;
914+
}
915+
return `<p>willDestroyCalls: ${calls}</p>
916+
<button>Toggle child</button>
917+
<!---->
918+
`;
919+
};
920+
921+
const el = () => this.element as unknown as HTMLElement;
922+
const click = () => {
923+
el().querySelector('button')?.click();
924+
this.rerender();
925+
};
926+
927+
this.assert.strictEqual(state.willDestroyCalls, 0, '0 destructions');
928+
this.assertHTML(output(0, true), 'initial render');
929+
930+
click();
931+
this.assert.strictEqual(state.willDestroyCalls, 1, '1 destruction');
932+
this.assertHTML(output(1, false), 'destroyed once');
933+
934+
click();
935+
this.assert.strictEqual(state.willDestroyCalls, 1, '1 destruction');
936+
this.assertHTML(output(1, true), 'shown again, no change');
937+
938+
click();
939+
this.assert.strictEqual(state.willDestroyCalls, 2, '2 destruction');
940+
this.assertHTML(output(2, false), 'destroyed twice');
941+
942+
this.destroy();
907943
this.assertHTML('', 'destroys correctly');
908944
}
909945

0 commit comments

Comments
 (0)