W3C home > Mailing lists > Public > public-css-archive@w3.org > July 2020

Re: [csswg-drafts] [css-pseudo-4] Add a highlight pseudo-element for find-in-page or scroll-to-text (#5233)

From: CSS Meeting Bot via GitHub <sysbot+gh@w3.org>
Date: Thu, 30 Jul 2020 16:02:54 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-666488974-1596124972-sysbot+gh@w3.org>
The CSS Working Group just discussed `Highlight pseudo-element for find-in-page / scroll-to-text`, and agreed to the following:

* `RESOLVED: Megan replaces Tess as editor of Highlight API spec`

<details><summary>The full IRC log of that discussion</summary>
&lt;fantasai> Topic: Highlight pseudo-element for find-in-page / scroll-to-text<br>
&lt;Rossen_> github:https://github.com/w3c/csswg-drafts/issues/5233<br>
&lt;fantasai> florian: In Pseudos 4 we have ::selection, ::grammar-error, ::spelling-error<br>
&lt;fantasai> florian: Another thing ppl sometimes want to style is find-in-page highlight<br>
&lt;fantasai> florian: so maybe we want one of those<br>
&lt;fantasai> florian: I think I'd like to point out two things<br>
&lt;fantasai> florian: There is a work in progress spec to try to make it possible for authors to create custom highlights for any reason<br>
&lt;fantasai> florian: on the JS side of things, you'd set ranges on the page<br>
&lt;Rossen_> spec in reference is https://drafts.csswg.org/css-highlight-api-1/<br>
&lt;fantasai> florian: on CSS side you can style them<br>
&lt;fantasai> florian: If you want to style the browser one<br>
&lt;fantasai> florian: pointed out at least by Apple<br>
&lt;fantasai> florian: unlike the others, the UI that is used by some browsers<br>
&lt;fantasai> florian: isn't something you can create in CSS<br>
&lt;fantasai> florian: so expressing through selector, you can't express those effects in CSS<br>
&lt;tantek> curious about the visual effects that can't be expressed in CSS, screenshots?<br>
&lt;fantasai> florian: so proposed resolution is partially no change, and partially poke the editors of that spec<br>
&lt;fantasai> cbiesinger: scroll-to-text is that when searching for a thing and click search result, the browser will scroll to the first matching fragment<br>
&lt;fantasai> florian: idk if we want authors to have control over the UI<br>
&lt;fantasai> florian: or if want consistency across pages and should stay out of authors' hands<br>
&lt;tantek> this is also used by the IndieWeb for annotations and marginalia with fragmentions https://indieweb.org/fragmention<br>
&lt;tantek> q+<br>
&lt;Rossen_> ack tantek<br>
&lt;fantasai> tantek: 2 questions<br>
&lt;fantasai> tantek: find-in-page seems like a well-established feature<br>
&lt;fantasai> tantek: effects might not be consistent across browsers, could study and figure out what the effects are<br>
&lt;fantasai> tantek: curious about effects that can't be expressed in CSS<br>
&lt;fantasai> tantek: maybe add screenshots of the effect to the issue?<br>
&lt;fantasai> tantek: happy to defer decision until we have more info<br>
&lt;fantasai> tantek: don't seem to have a rush<br>
&lt;fantasai> tantek: on scroll-to-text or marginalia use case<br>
&lt;smfr> q+<br>
&lt;fantasai> tantek: in the Indie Web community, there's a diversity of how authors want to style this effect<br>
&lt;fantasai> tantek: both from perspective of person linking, and from perspective of site linking to the text<br>
&lt;fantasai> tantek: Sometimes author wants to say "these are the words I want to select"<br>
&lt;fantasai> tantek: and leave up to destination to highlight / style or not<br>
&lt;florian> q+<br>
&lt;fantasai> tantek: third case of browser doing something by default if neither author of link or author of page wants to do something<br>
&lt;fantasai> tantek: so complex interaction between author of the link, author of the page<br>
&lt;fantasai> tantek: maybe want to decide text fragment, or whole paragraph, or section, or something<br>
&lt;fantasai> tantek: and maybe browser does something<br>
&lt;fantasai> tantek: maybe need to investigate more<br>
&lt;fantasai> tantek: I see the utility for a page to control the presentation of highlights and annotations<br>
&lt;fantasai> tantek: but requires more study of possible effects to come up with a good solution<br>
&lt;florian> q?<br>
&lt;fantasai> tantek: Also sometimes animated<br>
&lt;fantasai> tantek: fragmention to a blog post of mine, my site will scroll to that paragraph, not to the text itself<br>
&lt;fantasai> tantek: and then do yellow highlight on that paragraph which then fades away<br>
&lt;fantasai> tantek: non-intrusive, here's what you are looking for<br>
&lt;fantasai> tantek: didn't want to pollute styling with something persistent<br>
&lt;fantasai> tantek: not sure that's possible with pseudo-element either<br>
&lt;fantasai> tantek: bunch of ways ppl doing presentation effects with this<br>
&lt;fantasai> tantek: so requires further documentation before designing a solution<br>
&lt;chrishtr> q+<br>
&lt;fantasai> smfr: I don't think the page can currently detect when the user does find in page<br>
&lt;fantasai> smfr: if we allow highlighting, then that exposes that information<br>
&lt;fantasai> smfr: so some privacy concerns there<br>
&lt;fantasai> smfr: not sure I want that to happen<br>
&lt;Rossen_> ack smfr<br>
&lt;Rossen_> ack fantasai<br>
&lt;Zakim> fantasai, you wanted to note :target allows anything, right? and to<br>
&lt;tantek> example link to the animation effect I was mentioning: https://tantek.com/2020/187/b1/changes-indieweb-organizing-indiewebcamp-west#keep%20listening (should work in any browser with JS turned on, Fragmentions implemented with a polyfill on my site)<br>
&lt;fantasai> fantasai: I don't think anything is exposed to the author<br>
&lt;fantasai> fantasai: highlight pseudos don't affect computed style or layout or anything except painting for the user<br>
&lt;tantek> scribenick: tantek<br>
&lt;fantasai> scribeNick: fantasai<br>
&lt;fantasai> smfr: Is there an API to detect?<br>
&lt;fantasai> florian: not yet determined<br>
&lt;Rossen_> ack florian<br>
&lt;fantasai> smfr: user after finding, can hit ? to select the result<br>
&lt;fantasai> florian: back to tantek's point wrt research<br>
&lt;fantasai> florian: one aspect not doable in CSS in general<br>
&lt;fantasai> florian: these pseudos are non-tree-abiding, and cannot affect layout<br>
&lt;fantasai> florian: so things that you can do in CSS in general, you can't do with these types of pseudo-elements<br>
&lt;fantasai> florian: so need to know what authors would want to do, if it's even possible<br>
&lt;fantasai> chrishtr: [asks for tantek to clarify]<br>
&lt;Rossen_> ack chrishtr<br>
&lt;fantasai> tantek: IndieWeb community is trying out different presentations of how to show fragmention when someone links to your site with a fragmention<br>
&lt;fantasai> tantek: yellow paragraph highlight + fade is just one example<br>
&lt;fantasai> tantek: others folks have used other effects<br>
&lt;fantasai> tantek: experimentation is happening on personal websites<br>
&lt;fantasai> tantek: e.g. "scroll that into view, show specific effect"<br>
&lt;fantasai> tantek: using polyfill right now<br>
&lt;fantasai> chrishtr: so writing JS code that parses the text in the URL?<br>
&lt;fantasai> tantek: I believe it's a fairly straightforward simple polyfill<br>
&lt;fantasai> tantek: which then adds class names that you can style<br>
&lt;fantasai> tantek: so that there's a separation between polyfill and provides a hook that author can style accordingly<br>
&lt;fantasai> tantek: not everyone has to write JS<br>
&lt;fantasai> chrishtr: main response to that is cool to be experimenting with this effect<br>
&lt;fantasai> chrishtr: ...<br>
&lt;fantasai> tantek: There are other interactions where select text in a blog post<br>
&lt;fantasai> tantek: you'd have options to then tweet that text, or do something else<br>
&lt;fantasai> tantek: multiple phases<br>
&lt;fantasai> tantek: method of causing a highlight to occurr<br>
&lt;fantasai> tantek: DOM hooks to style the highlight<br>
&lt;fantasai> tantek: independent of that you could potentially provide a UI to do something with the highlighted text<br>
&lt;fantasai> tantek: e.g. +1 the highlight, or copy and post to Twitter<br>
&lt;fantasai> Rossen_: sorry to interject, but I think we're straying<br>
&lt;fantasai> chrishtr: I agree with those use cases and would like to follow up offline<br>
&lt;fantasai> chrishtr: main point is, as long as we're making progress towards exploring this space so we can find the right APIs to expose that's good<br>
&lt;fantasai> chrishtr: Right now feature in one browsers that does not allow customization of the color<br>
&lt;tantek> looks like the fragmention polyfill I'm using puts a "fragmention" attribute on the containing paragraph (or possibly nearest block-level element)<br>
&lt;fantasai> chrishtr: and quite a lot of dev requests to change color in that particular UI mode<br>
&lt;fantasai> chrishtr: and want to respect that desire and make progress to authors customize look and feel<br>
&lt;fantasai> florian: The challenge here is that these are very restrictive pseudo-elements, only a few aspects of rendering can be change<br>
&lt;tantek> color (and background-color) are just the beginning of these needs, that's the point<br>
&lt;fantasai> florian: so need to see if what is desired is possible to solve via highlight pseudo<br>
&lt;tantek> we shouldn't prematurely optimizing for only color is my point<br>
&lt;tantek> s/prematurely/be prematurely<br>
&lt;fantasai> Rossen_: Somewhat related to highlight API spec<br>
&lt;hober> q+<br>
&lt;fantasai> hober: I'd like to step down as co-editor of highlight API, haven't had time<br>
&lt;fantasai> hober: I'd like to suggest as my replacement Megan Gardner<br>
&lt;fantasai> hober: she did the WebKit implementation<br>
&lt;fantasai> florian: I don't plan to step down, and I look forward to work with Megan<br>
&lt;fantasai> RESOLVED: Megan replaces Tess as editor of Highlight API spec<br>
&lt;fantasai> fantasai: think that find-in-page vs fragmention are slightly different in their needs<br>
&lt;Rossen_> ack hober<br>
&lt;Rossen_> ack fantasai<br>
&lt;tantek> +1 fantasai totally agreed the features are different<br>
&lt;fantasai> fantasai: so let's keep those things distinct in the discussion<br>
&lt;fantasai> Rossen_: +1<br>
&lt;fantasai> Rossen_: Ppl working on this need to figure out the boundaries between ? and ?<br>
&lt;fantasai> Rossen_: which exposes user interaction<br>
&lt;fantasai> Rossen_: if we are exposing something new, we are adding additional privacy-related exposure to the content layer<br>
&lt;fantasai> Rossen_: That is biggest sticking point, are we starting to expose something additional, and if so how so<br>
&lt;fantasai> Rossen_: outside of that, good thing to continue investigating<br>

GitHub Notification of comment by css-meeting-bot
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/5233#issuecomment-666488974 using your GitHub account

Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Thursday, 30 July 2020 16:05:06 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:42:12 UTC