I have been working on upgrading my project and wanted to make sure I was using the latest ECMAScript version.
In my tsconfig.spec.json files, I originally had es2016, but I decided to try updating it to 2018 and even experimented with es2022.
After changing versions, most of my tests passed without any issues. However, there are a few that now fail. One specific case is a method that closes and destroys a modal.
async destroyModal(): Promise<void> {
const { modalComponentType, modalComponentRef } = this._state$.value;
document.querySelector('dialog')?.close();
this.setState({ modalComponentType, modalComponentRef, modalOpen: false }, ModalStateActions.CloseModal);
// Wait for 300ms for animation before proceeding
await new Promise(resolve => setTimeout(resolve, 300));
// Clear the modal container and notify observers
this.resetModal();
}
For testing purposes, I have the following test:
it('should destroy modal on esc press', fakeAsync(() => {
service.initModalContainer(hostComponent.componentInstance.viewContainerRef);
service.createModal(DummyComponent).then(() => verifyModalCreated());
tick();
dispatchEscPressEvent();
tick(500);
verifyModalDestroyed();
}));
With es2016, the test works as expected by simulating the passage of time and then calling verifyModalDestroyed(). However, with es2018 or es2022, the test fails before the Promise resolves inside the destroyModal() method. It seems like the tick() function no longer has an effect after the update.
Could someone please help me understand what changes between the ECMAScript versions could be causing these test failures?