[css-pseudo] Initial draft of ::selection

Author: fantasai

css-pseudo/Overview.bs

@@ -417,6 +417,116 @@ Styling the ''::first-letter'' Pseudo-element</h4>
   approximate font sizes, for example to align baselines. Also, the glyph
   outline may be taken into account when formatting. 
 
+<h2 id="highlight-pseudos">
+Highlight Range Pseudo-element: ''::selection''</h2>
+
+  The <dfn>::selection</dfn> pseudo-element represents
+  the portion of a document that has been highlighted by the user.
+  This also applies, for example, to selected text within an editable text field.
+
+  Issue: We want to add other types of selections, such as spelling-error highlights.
+
+  Issue: Active vs. inactive selections are often styled differently. Currently no way to distinguish.
+
+  <p>The <dfn>root highlight</dfn> is a multi-piece overlay
+  over the entire tree,
+  portions of which are selected and correspond to the ''::selection'' pseudo-element.
+  Each box owns the piece of of the overlay corresponding to any text or replaced content
+  directly contained by the box.
+  For text, the corresponding overlay must cover at least the entire em box
+  and may extend further above/below the em box to the line box edges.
+  Spacing between two characters may also be part of the overlay,
+  in which case it belongs to the innermost element that contains both characters
+  and is selected when both characters are selected
+  For replaced content, the associated overlay must cover at least the entire replaced object,
+  and may extend outward to include the element's entire content box.
+  The overlay may also include other other areas within the border-box of an element;
+  in this case, those areas belong to the innermost such element that contains the area.
+
+  Issue: See
+  <a href="http://lists.w3.org/Archives/Public/www-style/2008Nov/0022.html">F2F minutes</a>,
+  <a href="http://lists.w3.org/Archives/Public/www-style/2008Oct/0268.html">dbaron's message</a>,
+  <a href="http://lists.w3.org/Archives/Public/www-style/2010May/0247.html">Daniel's thread</a>,
+  <a href="http://lists.w3.org/Archives/Public/www-style/2010May/0261.html">Gecko notes</a>,
+  <a href="http://lists.w3.org/Archives/Public/www-style/2010May/0366.html">Opera notes</a>,
+  <a href="http://lists.w3.org/Archives/Public/www-style/2010May/0280.html">Webkit notes</a>
+
+  Each element draws its own portion of the highlighted overlay,
+  which receives the styles specified by the ''::selection'' pseudo-element styles
+  for which it or one of its ancestors is the <i>originating element</i>.
+  When multiple styles conflict,
+  the winning style is the one belonging to the innermost element
+  after cascading.
+
+  Issue: This could alternately be described in terms of inheritance.
+  So, how do we want ''inherit'' to behave here?
+  Should it inherit from the parent ''::selection''
+  or the <i>originating element</i>?
+  Opera does the former, Gecko/Blink the latter.
+
+  <p class="advisement">
+  Authors wanting multiple selections styles should use
+  <strong>'':root::selection''</strong>
+  for their document-wide selection style,
+  since this will allow clean overriding in descendants.
+  (''::selection'' alone would apply to every element in the tree,
+  overriding the more specific styles of any ancestors.)
+
+<h3 id="highlight-styling">
+Styling Highlighted Ranges</h3>
+
+  The following properties apply to ''::selection'' pseudo-elements:
+  
+  <ul>
+    <li>'color'
+    <li>'background-color'
+    <li>'cursor' (optional)
+    <li>'outline' and its longhands (optional)
+    <li>'text-decoration' and its associated properties (optional)
+  </ul>
+
+  Issue: What properties should be included here?
+  Only color and bgcolor seem supported; but text-decoration is needed for spellcheck.
+
+  If 'color' is not specified, the text's actual color must be used for the highlight.
+  <span class="issue">Can we reuse ''currentColor'' for this, now that it computes to itself?</span>
+  (As usual, the initial 'background-color' is ''transparent''.)
+
+  The UA should use the OS-default selection color
+  when neither 'color' nor 'background-color' has been specified by the author.
+
+  Issue: This behavior does not let us use the normal cascade for representing the OS colors
+  and thus violates <a href="http://lists.w3.org/Archives/Public/www-style/2008Oct/0268.html">dbaron's #2 requirement</a>. :(
+  Can we do anything about that?
+
+  The ''::selection'' pseudo element draws its background
+  over the selected portion of the element,
+  immediately below any positioned descendants
+  (i.e. just before step 8 in <a href="http://www.w3.org/TR/CSS21/zindex.html">CSS2.1&sect;E.2</a>).
+  It also suppresses the drawing of any selected text
+  and instead redraws that text
+  (and any text decorations)
+  over that background.
+
+  Issue: Implementations seem to redraw text decorations and text shadows over the selection background.
+  This seems particularly weird if the text decoration color doesn't match the text.
+  Perhaps the only thing visible should be the text itself (unless the background is transparent)
+  and any text decorations specified for the selection itself.
+  (Alternately the decorations should get the color of the selected text,
+  not the unselected text.)
+
+  For non-replaced content, the UA must honor the 'color' and 'background-color'
+  (including their alpha channels) as specified.
+  However, for replaced content, the UA should create a semi-transparent wash
+  to coat the content so that it can show through the selection.
+  This wash should be of the specified 'background-color' if that is not ''transparent'',
+  else the specified 'color';
+  however the UA may adjust the alpha channel if it is opaque.
+
+  Issue: The wash requirement is a minor update on WebKit's behavior. Gecko & Opera just use the default selection color for the wash.
+
+  Issue: This whole section needs vocabulary cleanup.
+
 <h2 id="generated-content">
 Generated Content Pseudo-elements: ''::before'' and ''::after''</h2>