HTML dialog as a notification method #19

jacksonchen666 commented 2026年04月09日 09:16:45 +02:00

This has been building over time already in the dialog-box, just adding this into the tracker now.

Originally sparked from a complaint about alert() blocking the web page from doing things, like loading.

Now my goal is to make it function as close to alert() as possible in all ways, doing better when possible.

List of behaviors off the top of my head that must be replicated perfectly correctly or needs more thought:

• Keyboard shortcuts (space, enter, escape, scrolling keys, that's it maybe?)
  • Space should be a configurable dismiss or scroll, and default to scroll since accidental dismissal is going to be annoying.
  • What would Enter be? It should probably not close when used with keyboard navigation
• Scrolling (don't transfer scrolling to behind dialog lol)
  • Page up/down scrolling
• Screen readers (needs external user testing because the only screen reader experience I have is a bit of macOS Voiceover, but current dev state is suboptimal announcing the close button)
• Probably more that I forgot

Eventual advantages of the dialog box:

• It's HTML, so things can be turned into clickable links, which is plainly better than having to copy links and pasting them right back into your browser

This has been building over time already in the `dialog-box`, just adding this into the tracker now. Originally sparked from a complaint about `alert()` blocking the web page from doing things, like loading. Now my goal is to make it function as close to `alert()` as possible in all ways, doing better when possible. List of behaviors off the top of my head that must be replicated perfectly correctly or needs more thought: - [ ] Keyboard shortcuts (space, enter, escape, scrolling keys, that's it maybe?) - [ ] Space should be a configurable dismiss or scroll, and default to scroll since accidental dismissal is going to be annoying. - [ ] What would Enter be? It should probably not close when used with keyboard navigation - [ ] Scrolling (don't transfer scrolling to behind dialog lol) - [ ] Page up/down scrolling - [ ] Screen readers (needs external user testing because the only screen reader experience I have is a bit of macOS Voiceover, but current dev state is suboptimal announcing the close button) - Probably more that I forgot Eventual advantages of the dialog box: - It's HTML, so things can be turned into clickable links, which is plainly better than having to copy links and pasting them right back into your browser

jacksonchen666 commented 2026年04月12日 16:36:35 +02:00

Idea: With running multiple checks (to fix the problem of #13), each checks could be split into like headers and then show their own result. That presentation of information should also mean I probably don't have to write special case text for every case of checks run and checks not run.

Idea: With running multiple checks (to fix the problem of #13), each checks could be split into like headers and then show their own result. That presentation of information should also mean I probably don't have to write special case text for every case of checks run and checks not run.

jacksonchen666 commented 2026年04月26日 03:50:36 +02:00

Pushed random changes I had lying around.

Some TODOs I think:

• Dialog having dual scrollbars when small enough
• Page down/up scrolling should affect the scrolling container

Pushed random changes I had lying around. Some TODOs I think: - Dialog having dual scrollbars when small enough - Page down/up scrolling should affect the scrolling container

jacksonchen666 commented 2026年05月03日 00:53:47 +02:00

Dumping some thoughts

Idea: Table layout (consistent size for each column of info)

Input handling, and Tridactyl taking the escape key: I'm not sure if taking control of the escape key away from Tridactyl is a good idea. Escape is used for canceling actions in Tridactyl, and it's still (technically) possible to use Tridactyl on a <dialog> box (the CSS for Tridactyl is broken on <dialog>'s though, but that's Tridactyl's problem). If the userscript took priority over Tridactyl, it could lead to the user unexpectedly closing the userscript's alert (either via userscript not giving it to Tridactyl, or escape key being used multiple times). However, I'm still kind of conflicted about this, because I do expect the <dialog> to be closed because I specified an attribute that makes it closed on the escape key, and then it doesn't.

Not sure what the right behavior would be, I think Tridactyl's escape key behavior should remain because of the multiple escape key presses. I'm not the most advanced Tridactyl user (I use it to scroll and click things essentially, not a whole lot else), and kind of expected the escape key to work on the dialog, even though I press the escape key multiple times usually to get rid of whatever mode I'm in for good.

Dumping some thoughts Idea: Table layout (consistent size for each column of info) Input handling, and Tridactyl taking the escape key: I'm not sure if taking control of the escape key away from Tridactyl is a good idea. Escape is used for canceling actions in Tridactyl, and it's still (technically) possible to use Tridactyl on a `<dialog>` box (the CSS for Tridactyl is broken on `<dialog>`'s though, but that's Tridactyl's problem). If the userscript took priority over Tridactyl, it could lead to the user unexpectedly closing the userscript's alert (either via userscript not giving it to Tridactyl, or escape key being used multiple times). However, I'm still kind of conflicted about this, because I do expect the `<dialog>` to be closed because I specified an attribute that makes it closed on the escape key, and then it doesn't. Not sure what the right behavior would be, I think Tridactyl's escape key behavior should remain because of the multiple escape key presses. I'm not the most advanced Tridactyl user (I use it to scroll and click things essentially, not a whole lot else), and kind of expected the escape key to work on the dialog, even though I press the escape key multiple times usually to get rid of whatever mode I'm in for good.

jacksonchen666/userscripts

jacksonchen666/userscripts