https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42925 --- Comment #1 from Jonathan Druart <jonathan.druart@gmail.com> --- Created attachment 201046 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=201046&action=edit Bug 42925: Replace the 'clear' button with an icon inside the search box On Chrome there is a builtin 'x' in the search box. The "Clear filter" button is then not needed. However it does not exist for Firefox. We could disable the builtin feature in Chrome add our own, so all browsers have it. Then the "Clear filter" button will no longer be needed. Test plan: 0. Rebuilt the CSS files: % yarn css:build Refresh the browser's cache, or use a private window Then, with both Firefox and Chrome (and any others web browsers you have): 1. Go to /cgi-bin/koha/admin/branches.pl => Notice that the "Clear filters" button is gone 2. Start typing in the global search => The table filters => The "x" icon is there when the input is not empty 3. Copy shareable link 4. Click the "x" icon => The table refreshes => The "x" is no longer visible 5. Use the shareable link => The global search is there => The "x" icon is visible -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42925 Jonathan Druart <jonathan.druart@gmail.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Blocks| |38185 Referenced Bugs: https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=38185 [Bug 38185] DT - replace dom with layout -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42925 David Nind <david@davidnind.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #201046|0 |1 is obsolete| | Attachment #201047|0 |1 is obsolete| | -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42925 --- Comment #4 from David Nind <david@davidnind.com> --- Created attachment 201128 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=201128&action=edit Bug 42925: (follow-up) Make clear button focusable Signed-off-by: David Nind <david@davidnind.com> -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42925 Nick Clemens (kidclamp) <nick@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Signed Off |Passed QA QA Contact|testopia@bugs.koha-communit |nick@bywatersolutions.com |y.org | -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42925 --- Comment #5 from Nick Clemens (kidclamp) <nick@bywatersolutions.com> --- Created attachment 204234 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=204234&action=edit Bug 42925: Replace the 'clear' button with an icon inside the search box On Chrome there is a builtin 'x' in the search box. The "Clear filter" button is then not needed. However it does not exist for Firefox. We could disable the builtin feature in Chrome add our own, so all browsers have it. Then the "Clear filter" button will no longer be needed. Test plan: 0. Rebuilt the CSS files: % yarn css:build Refresh the browser's cache, or use a private window Then, with both Firefox and Chrome (and any others web browsers you have): 1. Go to /cgi-bin/koha/admin/branches.pl => Notice that the "Clear filters" button is gone 2. Start typing in the global search => The table filters => The "x" icon is there when the input is not empty 3. Copy shareable link 4. Click the "x" icon => The table refreshes => The "x" is no longer visible 5. Use the shareable link => The global search is there => The "x" icon is visible Signed-off-by: David Nind <david@davidnind.com> Signed-off-by: Nick Clemens <nick@bywatersolutions.com> -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42925 Nick Clemens (kidclamp) <nick@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Passed QA |Failed QA --- Comment #7 from Nick Clemens (kidclamp) <nick@bywatersolutions.com> --- Testing further with 38185 - at smaller widths the X button ends up far outside of the input box - not sure if you want to fix here or on the next -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42925 --- Comment #10 from Nick Clemens (kidclamp) <nick@bywatersolutions.com> --- (In reply to Jonathan Druart from comment #9)

(In reply to Jonathan Druart from comment #8)

...

(In reply to Nick Clemens (kidclamp) from comment #7)

...

Testing further with 38185 - at smaller widths the X button ends up far outside of the input box - not sure if you want to fix here or on the next

I don't recreate this problemf without bug 38185 so I will try and fix it there.

However I do see: https://snipboard.io/ZTPorh.jpg at width=600 It's ok if I restore `top:50%`.

Owen, could you have a quick look?

The patch I've just attached on bug 38185 fixes both problems, see "Bug 38185: (follow-up) Fix search clear icon position at narrow widths"

Looked good during testing on other bug, moving back to PQA -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42925 Pedro Amorim (ammopt) <pedro.amorim@openfifth.co.uk> changed: What |Removed |Added ---------------------------------------------------------------------------- CC| |pedro.amorim@openfifth.co.u | |k --- Comment #11 from Pedro Amorim (ammopt) <pedro.amorim@openfifth.co.uk> --- Hi all, 1 not a blocker but wondering if intended: Clicking the 'x' jumps the page to the top and adds '#' to the URL The follow-up made the icon an <a href="#">, but the click handler doesn't call preventDefault(), so the browser follows the '#' after clearing the search. Any table whose search box is below the fold is affected; the old 'Clear filter' button didn't do this. 1) Inside KTD, build the CSS: $ ktd --shell k$ yarn css:build 2) Add 20 items to record 1 so its page scrolls: k$ perl -MKoha::Item -e 'Koha::Item->new({ biblionumber => 1, homebranch => "CPL", holdingbranch => "CPL", itype => "BK", barcode => "42925-$_" })->store for 1..20' 3) Open a private window (or refresh the browser's cache) and log in 4) Go to the record's detail page: http://localhost:8081/cgi-bin/koha/catalogue/detail.pl?biblionumber=1 5) Scroll down until the 'Holdings' table's search box is near the top of the window 6) Type 'Centerville' in the search box (it matches every row, so the page doesn't move) 7) Confirm an 'x' shows up inside the search box 8) Click the 'x' 9) Confirm the search box is cleared, but the page jumps back to the top and the URL now ends with '#' -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42925 Jonathan Druart <jonathan.druart@gmail.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|ASSIGNED |Passed QA -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42925 Pedro Amorim (ammopt) <pedro.amorim@openfifth.co.uk> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Passed QA |Failed QA --- Comment #14 from Pedro Amorim (ammopt) <pedro.amorim@openfifth.co.uk> --- Hey, this series causes KohaTable_spec.ts to fail: yarn cypress run --spec t/cypress/integration/KohaTable/KohaTable_spec.ts -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42925 Jonathan Druart <jonathan.druart@gmail.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Failed QA |Passed QA -- You are receiving this mail because: You are watching all bug changes.

https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=42925 --- Comment #17 from Jonathan Druart <jonathan.druart@gmail.com> --- (In reply to Owen Leonard from comment #15)

Created attachment 209864 [details] [review] Bug 42925: (follow-up) Adjust position of the X icon

Signed-off-by: Owen Leonard <oleonard@myacpl.org>

Note that this is going to be removed on "Bug 38185: (follow-up) Fix search clear icon position at narrow widths" anyway (now I have rebased it on top of your patch) -- You are receiving this mail because: You are watching all bug changes.