[Bug 37795] New: Stage MARC records for import progress bar broken by Bootstrap5 upgrade
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 Bug ID: 37795 Summary: Stage MARC records for import progress bar broken by Bootstrap5 upgrade Change sponsored?: --- Product: Koha Version: Main Hardware: All OS: All Status: NEW Keywords: regression Severity: normal Priority: P5 - low Component: Templates Assignee: oleonard@myacpl.org Reporter: phil@chetcolibrary.org QA Contact: testopia@bugs.koha-community.org Depends on: 35402 Prior to Bootstrap5, Stage MARC records for import was the poster child for UI when you have a background job that the user is going to sit waiting for completion. It had a neat centered progress bar, that started orange labelled 0% Not started, which changed to a green animated bar that ended 100% Finished. Now, it's an orange bar the full width of the page, labelled just "%" the whole time, and the only clue that it has finished is the appearance of the View batch link. Steps to reproduce: 1. Search the catalog for any record, from the details page Save - MARCXML 1. Cataloging - Stage records for import - Browse to the .marcxml file and select it 2. Upload file - when it's uploaded, Stage for import Referenced Bugs: https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=35402 [Bug 35402] Update the OPAC and staff interface to Bootstrap 5 -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 David Cook <dcook@prosentient.com.au> changed: What |Removed |Added ---------------------------------------------------------------------------- CC| |dcook@prosentient.com.au -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 Phil Ringnalda <phil@chetcolibrary.org> changed: What |Removed |Added ---------------------------------------------------------------------------- Summary|Stage MARC records for |job-progress.inc progress |import progress bar broken |bar broken by Bootstrap5 |by Bootstrap5 upgrade |upgrade --- Comment #1 from Phil Ringnalda <phil@chetcolibrary.org> --- Should also affect erm_sushi_harvester.inc and import_from_kbart_file.inc, though I don't know how to trigger either one to see. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 --- Comment #2 from Phil Ringnalda <phil@chetcolibrary.org> --- Ah, lots of changes affecting it. The colors from .progress-bar-success for green and .progress-bar-danger for red are now bg-success and bg-danger. And .progress-bar is now flex-direction: column; which means that putting the number in a span, the "%" in text, and the labels "Not started" etc. in another span no longer works, because that puts them in a column where the number is invisibly off the top, the % shows, and the label is invisibly off the bottom. Probably the labeling is also affected by overflow: hidden, and needs to add the class overflow-visible to the progress-bar, and then will need to set a text-color that is visible both on the filled and the unfilled part of the bar. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 --- Comment #3 from Phil Ringnalda <phil@chetcolibrary.org> --- (In reply to Phil Ringnalda from comment #0)
It had a neat centered progress bar... Now... the full width of the page
Outside the scope of this bug. It was in a class="dialog message" which was text-align: center and width: 65% max-width: 600px, now it's in a class="alert alert-info" which is none of those things, but for job-progress.inc it's up to the consumer to decide what to wrap it in. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 --- Comment #4 from Phil Ringnalda <phil@chetcolibrary.org> --- I don't think there's any really good solution to the overflow problem. I didn't notice it pre-BS5, but we actually had cropping of a sort then too: somewhere under 10-15%, there wouldn't be room for the <span>Started</span>, so it would wrap and thus become invisible, and at 1% there wouldn't be room for the "%". Bootstrap's advice that if you have a long label you should use the class overflow-visible and set a text-color that will work on both the progress-bar color and the progress background-color kind of hand-waves around the problem that no such color exists, unless you make your progress-bar colors washed-out enough that black is readable on them. The best solution I see is to darken the progress background-color enough to make white text sort of visible on it. Luckily, having a much wider progress bar now helps out: where before we were cropping up to 10-15% (depending on window size, text size, zoom, etc.), now with a pleasant sized window it's more like only up to 3%. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 Phil Ringnalda <phil@chetcolibrary.org> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|NEW |Needs Signoff -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 --- Comment #5 from Phil Ringnalda <phil@chetcolibrary.org> --- Created attachment 172930 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=172930&action=edit Bug 37795: Adjust job-progress.inc for Bootstrap 5 changes Four main changes: The color classes progress-bar-success and progress-bar-danger are now named bg-success and bg-danger. The aria attributes have moved from the progress-bar to the progress wrapper. Having them on the progress-bar is still supported for BS5, but won't be in BS6, so we might as well move them now rather than forgetting to move them later. Having the percentage number in a span, the % symbol in text, and the label for "Not started" "Started" "Finished" "Failed" in another span no longer works because the progress-bar content is in a column flexbox. Just setting all of it at once in the content of the progress-bar works fine. Before, overflow from the label being longer than the progress-bar happened by wrapping the "%" and "Started" invisibly down below the progress-bar. Now it is cropped off by overflow: hidden, so we have to deal with showing "2% Star" rather than showing "2%" and dropping the whole "Started" like we did before. The best solution seems to be making the background of the progress div, which is what shows to the right of the filled part of the progress-bar, a little darker grey so white text is readable if you squint. Test plan: 1. You need enough records to import so that you can at least see a bit of progress before it finishes. Ideally, you would have a file of 10K or so bibs, but with ktd, you can have 400-odd: Cataloging - Export catalog data, change the Output format to XML and the filename to koha.marcxml and export. 2. Cataloging - Stage records for import, Browse to your file, Upload file. Since you named it koha.marcxml, it's recognized as MARCXML and you can just click Stage for import 3. Without the patch, at this point you get an orange full-width bar, with a white "%" in the middle, which doesn't change even after the "View batch" link appears signalling it's done. With the patch, you start with an orange bar labelled "0% Not started" which changes to a green "0.00% Started" that animates too quickly to read to "100% Finished". Right click the bar, Inspect, double-click the "width: 100%" to edit it, click past the 100 and delete the 00 and press Enter to see a static 1%. You should be able to read the "100% Finished" even spread across the green and dark gray, at least by selecting the text if no other way. Sponsored-by: Chetco Community Public Library -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 Phil Ringnalda <phil@chetcolibrary.org> changed: What |Removed |Added ---------------------------------------------------------------------------- Assignee|oleonard@myacpl.org |phil@chetcolibrary.org -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 David Nind <david@davidnind.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Needs Signoff |Signed Off -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 David Nind <david@davidnind.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #172930|0 |1 is obsolete| | --- Comment #6 from David Nind <david@davidnind.com> --- Created attachment 172993 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=172993&action=edit Bug 37795: Adjust job-progress.inc for Bootstrap 5 changes Four main changes: The color classes progress-bar-success and progress-bar-danger are now named bg-success and bg-danger. The aria attributes have moved from the progress-bar to the progress wrapper. Having them on the progress-bar is still supported for BS5, but won't be in BS6, so we might as well move them now rather than forgetting to move them later. Having the percentage number in a span, the % symbol in text, and the label for "Not started" "Started" "Finished" "Failed" in another span no longer works because the progress-bar content is in a column flexbox. Just setting all of it at once in the content of the progress-bar works fine. Before, overflow from the label being longer than the progress-bar happened by wrapping the "%" and "Started" invisibly down below the progress-bar. Now it is cropped off by overflow: hidden, so we have to deal with showing "2% Star" rather than showing "2%" and dropping the whole "Started" like we did before. The best solution seems to be making the background of the progress div, which is what shows to the right of the filled part of the progress-bar, a little darker grey so white text is readable if you squint. Test plan: 1. You need enough records to import so that you can at least see a bit of progress before it finishes. Ideally, you would have a file of 10K or so bibs, but with ktd, you can have 400-odd: Cataloging - Export catalog data, change the Output format to XML and the filename to koha.marcxml and export. 2. Cataloging - Stage records for import, Browse to your file, Upload file. Since you named it koha.marcxml, it's recognized as MARCXML and you can just click Stage for import 3. Without the patch, at this point you get an orange full-width bar, with a white "%" in the middle, which doesn't change even after the "View batch" link appears signalling it's done. With the patch, you start with an orange bar labelled "0% Not started" which changes to a green "0.00% Started" that animates too quickly to read to "100% Finished". Right click the bar, Inspect, double-click the "width: 100%" to edit it, click past the 100 and delete the 00 and press Enter to see a static 1%. You should be able to read the "100% Finished" even spread across the green and dark gray, at least by selecting the text if no other way. Sponsored-by: Chetco Community Public Library 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=37795 Martin Renvoize (ashimema) <martin.renvoize@ptfs-europe.com> changed: What |Removed |Added ---------------------------------------------------------------------------- CC| |martin.renvoize@ptfs-europe | |.com QA Contact|testopia@bugs.koha-communit |martin.renvoize@ptfs-europe |y.org |.com -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 Martin Renvoize (ashimema) <martin.renvoize@ptfs-europe.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #172993|0 |1 is obsolete| | --- Comment #7 from Martin Renvoize (ashimema) <martin.renvoize@ptfs-europe.com> --- Created attachment 173436 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=173436&action=edit Bug 37795: Adjust job-progress.inc for Bootstrap 5 changes Four main changes: The color classes progress-bar-success and progress-bar-danger are now named bg-success and bg-danger. The aria attributes have moved from the progress-bar to the progress wrapper. Having them on the progress-bar is still supported for BS5, but won't be in BS6, so we might as well move them now rather than forgetting to move them later. Having the percentage number in a span, the % symbol in text, and the label for "Not started" "Started" "Finished" "Failed" in another span no longer works because the progress-bar content is in a column flexbox. Just setting all of it at once in the content of the progress-bar works fine. Before, overflow from the label being longer than the progress-bar happened by wrapping the "%" and "Started" invisibly down below the progress-bar. Now it is cropped off by overflow: hidden, so we have to deal with showing "2% Star" rather than showing "2%" and dropping the whole "Started" like we did before. The best solution seems to be making the background of the progress div, which is what shows to the right of the filled part of the progress-bar, a little darker grey so white text is readable if you squint. Test plan: 1. You need enough records to import so that you can at least see a bit of progress before it finishes. Ideally, you would have a file of 10K or so bibs, but with ktd, you can have 400-odd: Cataloging - Export catalog data, change the Output format to XML and the filename to koha.marcxml and export. 2. Cataloging - Stage records for import, Browse to your file, Upload file. Since you named it koha.marcxml, it's recognized as MARCXML and you can just click Stage for import 3. Without the patch, at this point you get an orange full-width bar, with a white "%" in the middle, which doesn't change even after the "View batch" link appears signalling it's done. With the patch, you start with an orange bar labelled "0% Not started" which changes to a green "0.00% Started" that animates too quickly to read to "100% Finished". Right click the bar, Inspect, double-click the "width: 100%" to edit it, click past the 100 and delete the 00 and press Enter to see a static 1%. You should be able to read the "100% Finished" even spread across the green and dark gray, at least by selecting the text if no other way. Sponsored-by: Chetco Community Public Library Signed-off-by: David Nind <david@davidnind.com> Signed-off-by: Martin Renvoize <martin.renvoize@ptfs-europe.com> -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 Martin Renvoize (ashimema) <martin.renvoize@ptfs-europe.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Signed Off |Passed QA --- Comment #8 from Martin Renvoize (ashimema) <martin.renvoize@ptfs-europe.com> --- Nice work Phil, thanks for the fix. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 Katrin Fischer <katrin.fischer@bsz-bw.de> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Passed QA |Pushed to main Version(s)| |24.11.00 released in| | -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 --- Comment #9 from Katrin Fischer <katrin.fischer@bsz-bw.de> --- Pushed for 24.11! Well done everyone, thank you! -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 Phil Ringnalda <phil@chetcolibrary.org> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Pushed to main |RESOLVED Resolution|--- |FIXED --- Comment #10 from Phil Ringnalda <phil@chetcolibrary.org> --- BS5 isn't going any further back than 24.11, so this doesn't need to either. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=37795 Bug 37795 depends on bug 35402, which changed state. Bug 35402 Summary: Update the OPAC and staff interface to Bootstrap 5 https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=35402 What |Removed |Added ---------------------------------------------------------------------------- Status|Pushed to main |RESOLVED Resolution|--- |FIXED -- You are receiving this mail because: You are watching all bug changes.
participants (1)
-
bugzilla-daemon＠bugs.koha-community.org