[whatwg] Concerns with <dialog>

Sat Nov 2 14:48:54 PDT 2013

On Sat, Nov 2, 2013 at 5:29 PM, Ian Hickson <ian at hixie.ch> wrote:

> On Sat, 2 Nov 2013, Brian Blakely wrote:
> >
> > 1. When a modal dialog is active, the user can still scroll the
> > underlying page.
>
> Why is that a bug?
>

By its nature, a modal view blocks interaction with the underlying content.

It's also inherently disorienting.  Imagine opening a modal, accidentally
scrolling the underlying page while interacting with said modal, then
closing the modal and seeing something totally different from before and
not understanding why.  This happens today with the majority of our
"lightbox" plugins, and we have the opportunity to fix it now.

> It seems bad if you can't, since you might need to refer to information in
> the underlying page.
>

Then the show() method can be used, not showModal().  That's partly why the
distinction is made.

> > 2. Even if the root element has overflow hidden, it should be possible
> > to scroll the modal "layer" when a dialog escapes the boundaries of the
> > viewport (or iframe).
>
> Why? Isn't the whole point of 'overflow: hidden' on the root element to
> prevent the ability to move the viewport?
>
> You can always but the overflow property on a child of the <body>, e.g. a
> fixed positioned <div>. Then the scrollbars would be hidden for the div,
> but the viewport could still be moved for dialogs.
>

<div> wrappers are what we use today, and are what <dialog> should be
alleviating.  Maybe ::backdrop should be a pseudo-parent for <dialog>, with
overflow: auto by default.  At the very least, that would be a much more
flexible solution going forward.

> > 3. When the modal dialog's height changes, either due to CSS or content
> > changes, the vertical position of the dialog should change (unless the
> > height exceeds the viewport height).
>
> That's an interesting idea, but I'm not convinced it's the right answer.
> Having the dialog move up and down when stuff is added at the bottom would
> be quite weird. You can always implement this manually from script.
>

To go back to hacky and rather difficult-to-maintain JS techniques for
something so simple seems antithetical to the intention of <dialog> to me.
 Modern modal implementations don't require that.