[Webkit-unassigned] [Bug 238751] [css-ui] Hide input[type=search] with appearance: textfield should look like input[type=text]

bugzilla-daemon at webkit.org bugzilla-daemon at webkit.org
Wed Apr 6 08:39:52 PDT 2022


https://bugs.webkit.org/show_bug.cgi?id=238751

zalan <zalan at apple.com> changed:

           What    |Removed                     |Added
----------------------------------------------------------------------------
                 CC|                            |zalan at apple.com

--- Comment #4 from zalan <zalan at apple.com> ---
(In reply to zsun from comment #3)
> (In reply to Tim Nguyen (:ntim) from comment #2)
> > This is a good starting point to hide the clear button:
> > 
> > diff --git a/Source/WebCore/html/shadow/TextControlInnerElements.cpp
> > b/Source/WebCore/html/shadow/TextControlInnerElements.cpp
> > index c0e8fee503fe..0098997ddc63 100644
> > --- a/Source/WebCore/html/shadow/TextControlInnerElements.cpp
> > +++ b/Source/WebCore/html/shadow/TextControlInnerElements.cpp
> > @@ -306,11 +306,13 @@ Ref<SearchFieldCancelButtonElement>
> > SearchFieldCancelButtonElement::create(Docum
> >      return element;
> >  }
> >  
> > -std::optional<Style::ElementStyle>
> > SearchFieldCancelButtonElement::resolveCustomStyle(const
> > Style::ResolutionContext& resolutionContext, const RenderStyle*)
> > +std::optional<Style::ElementStyle>
> > SearchFieldCancelButtonElement::resolveCustomStyle(const
> > Style::ResolutionContext& resolutionContext, const RenderStyle*
> > shadowHostStyle)
> >  {
> >      auto elementStyle = resolveStyle(resolutionContext);
> >      auto& inputElement = downcast<HTMLInputElement>(*shadowHost());
> >     
> > elementStyle.renderStyle->setVisibility(elementStyle.renderStyle-
> > >visibility() == Visibility::Hidden || inputElement.value().isEmpty() ?
> > Visibility::Hidden : Visibility::Visible);
> > +    if (shadowHostStyle->effectiveAppearance() == TextFieldPart)
> > +        elementStyle.renderStyle->setEffectiveDisplay(DisplayType::None);
> >      return elementStyle;
> >  }
> > 
> > 
> > 
> > Remaining issues are:
> > - width is too large compared to <input type="text"> (not quite sure why)
> > - focusring offset is too large compared to <input type="text"> (html.css
> > sets input[type=text] outline-offset to -2px, but [type=search] to 0,
> > outline-offset needs to be tied to appearance: textfield instead of
> > input[type])
> 
> I figure the remaining issues might still be related to the
> SearchFieldCancelButtonElement.  The extra width seems caused by the
> SearchFieldCancelButtonElement. When we do
> "elementStyle.renderStyle->setEffectiveDisplay(DisplayType::None);", is it
> supposed to re-rendering the box or just simply make the CancelButton
> invisible (but it still exists)? I'm not familiar with this code...
Not sure what you mean by re-rendering and/or invisible but display:none means no associated renderer which implies no geometry (i.e. does not take up any space. it is indeed invisible but not in the sense of CSS visibility but more like "it does not participate in layout at all". When an element gains "display: none", the associated renderer needs to be detached/destroyed and layout to be issued).

-- 
You are receiving this mail because:
You are the assignee for the bug.
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.webkit.org/pipermail/webkit-unassigned/attachments/20220406/dadfdf29/attachment.htm>


More information about the webkit-unassigned mailing list