Form actions doesn't work inside a common modal element

[muratgozel]

Describe the bug

Form actions doesn't seem to work when they rendered in a modal. The implementation of a modal is pretty common logic. Triggered by a user interaction and has a form inside. I have prepared a stackblitz that covers both working and a broken cases.

Your Example Website or App

https://stackblitz.com/edit/github-vlxsfuw4?file=src%2Froutes%2Findex.tsx

Steps to Reproduce the Bug or Issue

1. Click "test action inside modal". The modal will open.
2. Click "go to second phase"
3. Click "test" button.

Expected behavior

An alert should appear but it doesn't.

Also added the signin form to the index page, below the "test action inside modal" link. There, you can see the alert appears when you go to second phase and click test.

Screenshots or Videos

No response

Platform

• "@solidjs/meta": "^0.29.4",
• "@solidjs/router": "^0.15.0",
• "@solidjs/start": "^1.1.0",
• "solid-js": "^1.9.5",
• "vinxi": "^0.5.3"

Additional context

No response

[dennev]

In the components/modal.tsx file,
line 83 on:click={{ handleEvent: onViewportClick, capture: true }}
is the cause. This is triggered prioritized on the onclick event, so removing it worked fine.