Elchi3 / mdn-doc-tests

:no_entry_sign: UNMAINTAINED :no_entry_sign: This used to check MDN docs against some tests and cleanup tasks while editing, but add-on SDK based add-ons are obsolete. Use https://github.com/mdn/doc-linter-webextension and https://github.com/mdn/doc-linter-rules instead.
Mozilla Public License 2.0
10 stars 8 forks source link

[Idea] DevTools panel instead of sidebar #230

Closed Elchi3 closed 7 years ago

Elchi3 commented 7 years ago

Just an idea by @wbamberg that we might want to explore when rewriting this as an WebExtension (issue #181). We could be using a devtools panel for this, where we might have more space available. I think the nice thing about the sidebar is, that it quickly opens and closes automatically at the moment, but I just wanted to record this alternative UX idea here. Thoughts welcome.

SebastianZ commented 7 years ago

Because they are docked to the bottom of the browser by default, the DevTools provide more horizontal than vertical space. The docs tester UI is designed vertically, though, and taking horizontal space from the MDN editor is better than taking vertical space. Also, as you already note, it opens depending on the URL, which is beneficial in this case. (I hope that the WebExtension sidebar API will also have this feature!)

So, keeping it in a sidebar makes more sense to me.

Sebastian

wbamberg commented 7 years ago

The reason for this suggestion is that Chrome doesn't have a sidebar API.

SebastianZ commented 7 years ago

This is presumably one of the most-required features for extensions, so I'm sure Chrome will add a sidebar API sooner or later.

But we could add a DevTools panel as a fallback option. Or, maybe a separate window?

Sebastian

wbamberg commented 7 years ago

This is presumably one of the most-required features for extensions, so I'm sure Chrome will add a sidebar API sooner or later.

This seems unlikely: https://bugs.chromium.org/p/chromium/issues/detail?id=477424

SebastianZ commented 7 years ago

This is presumably one of the most-required features for extensions, so I'm sure Chrome will add a sidebar API sooner or later.

This seems unlikely: https://bugs.chromium.org/p/chromium/issues/detail?id=477424

Well, let's see if they change their mind once it's used a lot in Firefox extensions. Until then we may use a DevTools panel as a fallback. Though I'm still reluctant about this, as the UI has several flaws as outlined in my previous comment. Are there any other alternatives like inline panels or popups?

Sebastian

wbamberg commented 7 years ago

Yeah, I agree with you really, devtools is not a perfect fit. You can use a popup, but it has 3 drawbacks:

(1) you can't open it programmatically (although this might change) (2) it goes away if you click outside it (3) it would tend to obscure page content

Another option would be to add the UI in content, using an iframe built by a content script. In general this is a bad idea because a non-cooperative (or actively hostile) page is able to interfere with this UI in various ways. But in this case that doesn't apply - developer.mozilla.org should be a cooperative domain :). So maybe it's OK?

a2sheppy commented 7 years ago

Keep in mind that you can pop devtools panels out into a separate window, or switch to docking along the side instead of the bottom of the browser window.

Elchi3 commented 7 years ago

We're not going to do anything about this idea in the add-on SDK based doc-tester. See https://github.com/mdn/doc-linter-webextension/issues/1 for some discussion for the Webextension.