Skip to content

Extract page specific styles todos

Lukas 'ai-pi' Eipert requested to merge extract-page-specific-styles-todos into master

What does this MR do?

This MR is the first in a series of performance related MRs that will be moving page specific CSS out of the application.css bundle and into their own page bundles.

As per issue, #228852 (closed), we are using this first MR to establish a process for implementing these changes so that other team members can follow this approach going forward.

As such this MR introduces a few more changes than what follow-up MRs will, namely:

  1. A new app/assets/stylesheets/_page_specific_files.scss file that holds a reference to all page style files we want to extract into their own page bundle. As a page is moved out the entries in this file will be removed until we have none left.
  2. A new app/assets/stylesheets/page_bundles/_mixins_and_variables_and_everything.scss file that includes the various mixins, variables and functions needed to be included in the page specific bundles

The rest is simply a matter of referencing the new page bundle in the correct place and setting it to be precompiled.

Screenshots

Comparison of before after screenshots reveal no visual diffs of the TODOs page. CleanShot_2020-08-21_at_17.36.26_2x

Does this MR meet the acceptance criteria?

Conformity

Availability and Testing

There is a risk that any page specific styles that is now moved to a page bundle and might have been used by another page will no longer be available on the page that relied on this. While we are looking at using a tool for automated visual regression it is not ready for use yet and manual user spot testing is required to make sure no visual regressions were introduced.

Security

If this MR contains changes to processing or storing of credentials or tokens, authorization and authentication methods and other items described in the security review guidelines:

  • Label as security and @ mention @gitlab-com/gl-security/appsec
  • The MR includes necessary changes to maintain consistency between UI, API, email, or other methods
  • Security reports checked/validated by a reviewer from the AppSec team
Edited by Jean du Plessis

Merge request reports