jest test fails with modal: HTMLDialogElement not existing / Error: Uncaught [TypeError: this.dialog.close is not a function]

[james-williams-siemens]

Prerequisites

• [X] I have not leaked any internal company information.
• [X] I have not posted internal links or code snippets.

What happened?

When trying to write a jest test that requires interacting with a modal I get error when trying to close it:

  console.error
    HTMLDialogElement not existing

      at Modal.showModal (node_modules/@siemens/ix/components/src/components/modal/modal.tsx:171:15)

  console.error
    Error: Uncaught [TypeError: this.dialog.close is not a function]
        at reportException (/workspace/node_modules/jsdom/lib/jsdom/living/helpers/runtime-script-errors.js:66:24)
        at runAnimationFrameCallbacks (/workspace/node_modules/jsdom/lib/jsdom/browser/Window.js:601:13)
        at Timeout.<anonymous> (/workspace/node_modules/jsdom/lib/jsdom/browser/Window.js:577:11)
        at listOnTimeout (node:internal/timers:573:17)
        at processTimers (node:internal/timers:514:7) TypeError: this.dialog.close is not a function
        at /workspace/node_modules/@siemens/ix/components/src/components/modal/modal.tsx:212:19
        at Object.complete (/workspace/node_modules/@siemens/ix/components/src/components/modal/modal.tsx:140:11)
        at setCallback (/workspace/node_modules/@siemens/node_modules/animejs/lib/anime.es.js:1024:50)
        at setInstanceProgress (/workspace/node_modules/@siemens/node_modules/animejs/lib/anime.es.js:1080:11)
        at Object.instance.tick (/workspace/node_modules/@siemens/node_modules/animejs/lib/anime.es.js:1131:5)
        at step (/workspace/node_modules/@siemens/node_modules/animejs/lib/anime.es.js:879:24)
        at runAnimationFrameCallbacks (/workspace/node_modules/jsdom/lib/jsdom/browser/Window.js:599:13)
        at Timeout.<anonymous> (/workspace/node_modules/jsdom/lib/jsdom/browser/Window.js:577:11)
        at listOnTimeout (node:internal/timers:573:17)
        at processTimers (node:internal/timers:514:7)

      at VirtualConsole.<anonymous> (node_modules/jsdom/lib/jsdom/virtual-console.js:29:45)
      at reportException (node_modules/jsdom/lib/jsdom/living/helpers/runtime-script-errors.js:70:28)
      at runAnimationFrameCallbacks (node_modules/jsdom/lib/jsdom/browser/Window.js:601:13)
      at Timeout.<anonymous> (node_modules/jsdom/lib/jsdom/browser/Window.js:577:11)

What type of frontend frameware are you seeing the problem on?

React

Which version of iX do you use?

v2.1.0

Code to produce this issue.

https://codesandbox.io/p/devbox/modaltest-pzzncm

[matthiashader]

Thanks for your insights! We will have a look into it, in an upcoming sprint Internal Ref [IX-982]