Bug 26938 - Prevent flash of unstyled content on sales table
Summary: Prevent flash of unstyled content on sales table
Status: RESOLVED FIXED
Alias: None
Product: Koha
Classification: Unclassified
Component: Staff Client (show other bugs)
Version: master
Hardware: All All
: P5 - low minor (vote)
Assignee: Martin Renvoize
QA Contact: Josef Moravec
URL:
Keywords:
Depends on: 26172
Blocks: 26939
  Show dependency treegraph
 
Reported: 2020-11-05 13:43 UTC by Martin Renvoize
Modified: 2020-12-11 16:16 UTC (History)
6 users (show)

See Also:
Change sponsored?: ---
Patch complexity: Trivial patch
Text to go in the release notes:
Version(s) released in:
20.11.00, 20.05.07


Attachments
Bug 26938: Prevent flash of unstyled sales table (2.21 KB, patch)
2020-11-05 13:47 UTC, Martin Renvoize
Details | Diff | Splinter Review
Bug 26938: Prevent flash of unstyled sales table (2.26 KB, patch)
2020-11-06 06:21 UTC, David Nind
Details | Diff | Splinter Review
Bug 26938: Prevent flash of unstyled sales table (2.31 KB, patch)
2020-11-17 17:57 UTC, Josef Moravec
Details | Diff | Splinter Review

Note You need to log in before you can comment on or make changes to this bug.
Description Martin Renvoize 2020-11-05 13:43:26 UTC
The sales table in the register summary page contains some JSON formatted data for the DataTable. This content flashes on page load whilst DataTables is still loading and is unsightly.. we should delay the view of the table until DataTables has taken care of make it pretty ;)
Comment 1 Martin Renvoize 2020-11-05 13:47:25 UTC
Created attachment 113115 [details] [review]
Bug 26938: Prevent flash of unstyled sales table

On the registers page the table has come complex data structures
embedded to allow for all the functionality we bring into the datatable.

We should hide the table on page load and only display it at DataTables
init time once the weird content has been beautified by DataTables.

Test plan
1/ Enable 'UseCashRegisters' and 'EnablePointOfSale'
2/ Add a cash register and make some transactions against it.
3/ Navigate to the 'Register details' page
4/ Note that some 'funky' JSON strings appear in the table briefly
before it is restyled when DataTables loads.
5/ Apply the patch
6/ Rebuild the CSS from the SCSS files
7/ Reload the page (hard reload to get the CSS changes)
8/ Note that the table now only appears once the nice formatting that
DataTables adds is applied.
Comment 2 David Nind 2020-11-06 06:21:50 UTC
Created attachment 113218 [details] [review]
Bug 26938: Prevent flash of unstyled sales table

On the registers page the table has come complex data structures
embedded to allow for all the functionality we bring into the datatable.

We should hide the table on page load and only display it at DataTables
init time once the weird content has been beautified by DataTables.

Test plan
1/ Enable 'UseCashRegisters' and 'EnablePointOfSale'
2/ Add a cash register and make some transactions against it.
3/ Navigate to the 'Register details' page
4/ Note that some 'funky' JSON strings appear in the table briefly
before it is restyled when DataTables loads.
5/ Apply the patch
6/ Rebuild the CSS from the SCSS files
7/ Reload the page (hard reload to get the CSS changes)
8/ Note that the table now only appears once the nice formatting that
DataTables adds is applied.

Signed-off-by: David Nind <david@davidnind.com>
Comment 3 David Cook 2020-11-10 00:33:53 UTC
Thumbs up for this idea
Comment 4 Josef Moravec 2020-11-17 17:57:24 UTC
Created attachment 113751 [details] [review]
Bug 26938: Prevent flash of unstyled sales table

On the registers page the table has come complex data structures
embedded to allow for all the functionality we bring into the datatable.

We should hide the table on page load and only display it at DataTables
init time once the weird content has been beautified by DataTables.

Test plan
1/ Enable 'UseCashRegisters' and 'EnablePointOfSale'
2/ Add a cash register and make some transactions against it.
3/ Navigate to the 'Register details' page
4/ Note that some 'funky' JSON strings appear in the table briefly
before it is restyled when DataTables loads.
5/ Apply the patch
6/ Rebuild the CSS from the SCSS files
7/ Reload the page (hard reload to get the CSS changes)
8/ Note that the table now only appears once the nice formatting that
DataTables adds is applied.

Signed-off-by: David Nind <david@davidnind.com>

Signed-off-by: Josef Moravec <josef.moravec@gmail.com>
Comment 5 Jonathan Druart 2020-11-18 11:04:14 UTC
Pushed to master for 20.11, thanks to everybody involved!
Comment 6 Andrew Fuerste-Henry 2020-12-09 20:38:12 UTC
Missing dependencies, not backporting to 20.05.x
Comment 7 Andrew Fuerste-Henry 2020-12-10 21:41:24 UTC
Decided to backport this after all. It's not strictly dependent on 26172, applies fine without it.

Backported to 20.05.x for 20.05.07
Comment 8 Victor Grousset/tuxayo 2020-12-11 16:16:01 UTC
Not backported to oldoldstable (19.11.x). Feel free to ask if it's needed.