Commit 0da8c6af authored by David O'Regan's avatar David O'Regan

Merge branch 'ps-fix-startup-css-check-rules' into 'master'

Fix startup-css-check as-if-foss rules

See merge request gitlab-org/gitlab!63069
parents d43398cb 8eb2153d
......@@ -317,3 +317,30 @@ bundle-size-review:
expire_in: 31d
paths:
- bundle-size-review
.startup-css-check-base:
extends:
- .frontend-test-base
script:
- *yarn-install
- run_timed_command "yarn generate:startup_css"
- yarn check:startup_css
startup-css-check:
extends:
- .startup-css-check-base
- .frontend:rules:default-frontend-jobs
needs:
- job: "compile-test-assets"
- job: "rspec frontend_fixture"
- job: "rspec-ee frontend_fixture"
optional: true
startup-css-check as-if-foss:
extends:
- .startup-css-check-base
- .as-if-foss
- .frontend:rules:default-frontend-jobs-as-if-foss
needs:
- job: "compile-test-assets as-if-foss"
- job: "rspec frontend_fixture as-if-foss"
......@@ -3,6 +3,7 @@
"ignoreFiles": [
"app/assets/stylesheets/pages/emojis.scss",
"app/assets/stylesheets/startup/startup-*.scss",
"ee/app/assets/stylesheets/startup/startup-*.scss",
"app/assets/stylesheets/lazy_bundles/select2.scss",
"app/assets/stylesheets/highlight/themes/*.scss",
"app/assets/stylesheets/lazy_bundles/cropper.css"
......
......@@ -106,6 +106,10 @@
width: 100%;
}
}
.omniauth-btn {
width: 100%;
}
}
.new-session-tabs {
......
......@@ -45,6 +45,7 @@ input[type='checkbox']:hover {
margin: 0 8px;
form {
display: block;
margin: 0;
padding: 4px;
width: $search-input-width;
......
......@@ -36,7 +36,7 @@
= favicon_link_tag favicon, id: 'favicon', data: { original_href: favicon }, type: 'image/png'
= render 'layouts/startup_css'
= render 'layouts/startup_css', { startup_filename: local_assigns.fetch(:startup_filename, nil) }
- if user_application_theme == 'gl-dark'
= stylesheet_link_tag_defer "application_dark"
= yield :page_specific_styles
......
- startup_filename = current_path?("sessions#new") ? 'signin' : user_application_theme == 'gl-dark' ? 'dark' : 'general'
- startup_filename_default = user_application_theme == 'gl-dark' ? 'dark' : 'general'
- startup_filename = local_assigns.fetch(:startup_filename, nil) || startup_filename_default
%style
= Rails.application.assets_manifest.find_sources("themes/#{user_application_theme_css_filename}.css").first.to_s.html_safe if user_application_theme_css_filename
......
!!! 5
%html.devise-layout-html{ class: system_message_class }
= render "layouts/head"
= render "layouts/head", { startup_filename: 'signin' }
%body.ui-indigo.login-page.application.navless{ class: "#{client_class_list}", data: { page: body_data_page, qa_selector: 'login_page' } }
= header_message
= render "layouts/init_client_detection_flags"
......
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
......@@ -3,6 +3,7 @@
"scripts": {
"check-dependencies": "scripts/frontend/check_dependencies.sh",
"block-dependencies": "node scripts/frontend/block_dependencies.js",
"check:startup_css": "scripts/frontend/startup_css/startup_css_changed.sh",
"clean": "rm -rf public/assets tmp/cache/*-loader",
"dev-server": "NODE_OPTIONS=\"--max-old-space-size=3584\" node scripts/frontend/webpack_dev_server.js",
"file-coverage": "scripts/frontend/file_test_coverage.js",
......
......@@ -27,7 +27,6 @@ const CSS_TO_REMOVE = [
/\.commit/,
/\.md/,
/\.with-performance-bar/,
/\.identicon/,
];
const APPLICATION_CSS_PREFIX = 'application';
const APPLICATION_DARK_CSS_PREFIX = 'application_dark';
......@@ -36,49 +35,55 @@ const UTILITIES_DARK_CSS_PREFIX = 'application_utilities_dark';
// paths -----------------------------------------------------------------------
const ROOT = path.resolve(__dirname, '../../..');
const ROOT_RAILS = IS_EE ? path.join(ROOT, 'ee') : ROOT;
const FIXTURES_FOLDER_NAME = IS_EE ? 'fixtures-ee' : 'fixtures';
const FIXTURES_ROOT = path.join(ROOT, 'tmp/tests/frontend', FIXTURES_FOLDER_NAME);
const PATH_SIGNIN_HTML = path.join(FIXTURES_ROOT, 'startup_css/sign-in.html');
const PATH_ASSETS = path.join(ROOT, 'tmp/startup_css_assets');
const PATH_STARTUP_SCSS = path.join(ROOT, 'app/assets/stylesheets/startup');
const PATH_STARTUP_SCSS = path.join(ROOT_RAILS, 'app/assets/stylesheets/startup');
// helpers ---------------------------------------------------------------------
const createMainOutput = ({ outFile, cssKeys, type }) => ({
outFile,
htmlPaths: [
path.join(FIXTURES_ROOT, `startup_css/project-${type}.html`),
path.join(FIXTURES_ROOT, `startup_css/project-${type}-legacy-menu.html`),
path.join(FIXTURES_ROOT, `startup_css/project-${type}-legacy-sidebar.html`),
path.join(FIXTURES_ROOT, `startup_css/project-${type}-signed-out.html`),
],
cssKeys,
purgeOptions: {
safelist: {
standard: [
'page-with-icon-sidebar',
'sidebar-collapsed-desktop',
// We want to include the root dropdown-menu style since it should be hidden by default
'dropdown-menu',
],
// We want to include the identicon backgrounds
greedy: [/^bg[0-9]$/],
},
},
});
const OUTPUTS = [
{
createMainOutput({
type: 'general',
outFile: 'startup-general',
htmlPaths: [
path.join(FIXTURES_ROOT, 'startup_css/project-general.html'),
path.join(FIXTURES_ROOT, 'startup_css/project-general-legacy-menu.html'),
path.join(FIXTURES_ROOT, 'startup_css/project-general-signed-out.html'),
],
cssKeys: [APPLICATION_CSS_PREFIX, UTILITIES_CSS_PREFIX],
// We want to include the root dropdown-menu style since it should be hidden by default
purgeOptions: {
safelist: {
standard: ['dropdown-menu'],
},
},
},
{
}),
createMainOutput({
type: 'dark',
outFile: 'startup-dark',
htmlPaths: [
path.join(FIXTURES_ROOT, 'startup_css/project-dark.html'),
path.join(FIXTURES_ROOT, 'startup_css/project-dark-legacy-menu.html'),
path.join(FIXTURES_ROOT, 'startup_css/project-dark-signed-out.html'),
],
cssKeys: [APPLICATION_DARK_CSS_PREFIX, UTILITIES_DARK_CSS_PREFIX],
// We want to include the root dropdown-menu styles since it should be hidden by default
purgeOptions: {
safelist: {
standard: ['dropdown-menu'],
},
},
},
}),
{
outFile: 'startup-signin',
htmlPaths: [PATH_SIGNIN_HTML],
cssKeys: [APPLICATION_CSS_PREFIX, UTILITIES_CSS_PREFIX],
purgeOptions: {
safelist: {
standard: ['fieldset'],
standard: ['fieldset', 'hidden'],
deep: [/login-page$/],
},
},
......
#!/bin/sh
echo "-----------------------------------------------------------"
echo "If you run into any issues with Startup CSS generation"
echo "please check out the feedback issue:"
echo ""
echo "https://gitlab.com/gitlab-org/gitlab/-/issues/331812"
echo "-----------------------------------------------------------"
startup_glob="*stylesheets/startup*"
echo "Staging changes to '${startup_glob}' so we can check for untracked files..."
git add ${startup_glob}
if [ -n "$(git diff HEAD --name-only -- ${startup_glob})" ]; then
diff=$(git diff HEAD -- ${startup_glob})
cat <<EOF
Startup CSS changes detected!
It looks like there have been recent changes which require
regenerating the Startup CSS files.
**What should I do now?**
IMPORTANT: Please make sure to update your MR title with `[RUN AS-IF-FOSS]` and start a new MR pipeline
To fix this job, consider one of the following options:
1. Regenerating locally with "yarn run generate:startup_css".
2. Copy and apply the following diff:
----- start diff -----
$diff
----- end diff -------
EOF
exit 1
fi
......@@ -9,7 +9,7 @@ const buildFinalContent = (raw) => {
// https://gitlab.com/gitlab-org/gitlab/-/issues/331812
@charset "UTF-8";
${raw}
@import 'cloaking';
@import 'startup/cloaking';
@include cloak-startup-scss(none);
`;
......
......@@ -11,12 +11,13 @@ RSpec.describe 'Startup CSS fixtures', type: :controller do
before(:all) do
stub_feature_flags(combined_menu: true)
stub_feature_flags(sidebar_refactor: true)
clean_frontend_fixtures('startup_css/')
end
shared_examples 'startup css project fixtures' do |type|
let(:user) { create(:user, :admin) }
let(:project) { create(:project, :public, :repository, description: 'Code and stuff', avatar: fixture_file_upload('spec/fixtures/dk.png', 'image/png'), creator: user) }
let(:project) { create(:project, :public, :repository, description: 'Code and stuff', creator: user) }
before do
sign_in(user)
......@@ -42,6 +43,17 @@ RSpec.describe 'Startup CSS fixtures', type: :controller do
expect(response).to be_successful
end
it "startup_css/project-#{type}-legacy-sidebar.html" do
stub_feature_flags(sidebar_refactor: false)
get :show, params: {
namespace_id: project.namespace.to_param,
id: project
}
expect(response).to be_successful
end
it "startup_css/project-#{type}-signed-out.html" do
sign_out(user)
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment