Mink icon indicating copy to clipboard operation
Mink copied to clipboard

Consider using Polymer to replace custom shadow DOM UI

Open machawk1 opened this issue 8 years ago • 3 comments

In #77 we adapted the UI to use the Shadow DOM but there are still cases (examples?) where the container page is affecting the Mink UI. As recommended in that ticket, Polymer offers custom UI elements that would make the Mink UI less awkward and potentially easier to both maintain and manipulate in the future.

machawk1 avatar Aug 24 '17 03:08 machawk1

The page affecting the Mink UI should no longer be an issue, but moving over to a custom element based shadow DOM like https://github.com/oduwsdl/reconstructive does as integrated into https://github.com/oduwsdl/ipwb would give more control without the page's style of conventional elements (the Mink UI is currently made up of standard HTML elements) affecting the Mink UI.

machawk1 avatar Jan 06 '18 18:01 machawk1

Since Mink is Chrome specific, which has excellent support of Web Components, we don't need Polymer for this (though we can use it if we want to). That will be one less dependency to worry about while utilizing native browser capabilities and standard JS syntax.

While adding a custom element or some generic HTML elements inside a shadow DOM isolates the style, we must be careful when adding any events listeners on global objects such as on window. The page in question might have some event listeners attached to it already, so we need to append to it rather than overwriting existing event listeners.

ibnesayeed avatar Jan 06 '18 19:01 ibnesayeed

@ibnesayeed That's the idea and thanks for the insight. I believe Mink does not currently write any event listeners on the window and only interacts with the browser's window instance when using localStorage.

machawk1 avatar Jan 06 '18 19:01 machawk1