diff --git a/CHANGELOG.md b/CHANGELOG.md index 1d8338d978..02faf0c5ec 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,10 @@ useful summary for people upgrading their application, not a replication of the commit log. +## Unreleased + +* Add govuk-frontend checking to the component auditing ([PR #4058](https://github.com/alphagov/govuk_publishing_components/pull/4058)) + ## 39.0.0 * Use `GOVUK_ENVIRONMENT` instead of `GOVUK_ENVIRONMENT_NAME` for current environment ([PR #4060](https://github.com/alphagov/govuk_publishing_components/pull/4060)) diff --git a/app/models/govuk_publishing_components/audit_components.rb b/app/models/govuk_publishing_components/audit_components.rb index d72196bd9c..97b7b34e67 100644 --- a/app/models/govuk_publishing_components/audit_components.rb +++ b/app/models/govuk_publishing_components/audit_components.rb @@ -22,6 +22,8 @@ def initialize(path, options = {}) stylesheet: 0, print_stylesheet: 0, javascript: 0, + uses_govuk_frontend_js: 0, + uses_govuk_frontend_css: 0, test: 0, javascript_test: 0, helper: 0, @@ -120,6 +122,16 @@ def get_component_asset_detail(detail, component) details["#{type}_exists".to_sym] = true details["#{type}_lines".to_sym] = count_lines_in(file) details["#{type}_link".to_sym] = get_asset_link(type, component) + + if type == "javascript" && uses_govuk_frontend_js?(file) + details[:uses_govuk_frontend_js] = true + @component_numbers[:uses_govuk_frontend_js] += 1 + end + + if type == "stylesheet" && uses_govuk_frontend_css?(file) + details[:uses_govuk_frontend_css] = true + @component_numbers[:uses_govuk_frontend_css] += 1 + end end end @@ -130,6 +142,14 @@ def count_lines_in(file) File.read(file).each_line.count end + def uses_govuk_frontend_js?(file) + File.read(file).match(/require govuk\/components/) + end + + def uses_govuk_frontend_css?(file) + File.read(file).match(/@import "govuk\/components/) + end + def clean_files(files, replace) files.map { |file| clean_file_name(file.gsub(replace, "")) }.sort end diff --git a/app/views/govuk_publishing_components/audit/_component_contents.html.erb b/app/views/govuk_publishing_components/audit/_component_contents.html.erb index ed00994971..bbf2a6dbe0 100644 --- a/app/views/govuk_publishing_components/audit/_component_contents.html.erb +++ b/app/views/govuk_publishing_components/audit/_component_contents.html.erb @@ -1,44 +1,59 @@ +

+ Numbers in table headers show column totals. Numbers in table cells show number of lines in files. Note that component test files cannot currently be detected in applications that use minitest instead of Rspec.

+

data-audit-headings<% end %>> - - - - - - - + + - + + +
Component + Template <% unless show_application_name %> <%= passed_components[:component_numbers][:template] %> <% end %> - CSS + + CSS <% unless show_application_name %> <%= passed_components[:component_numbers][:stylesheet] %> <% end %> - Print styles + + Print CSS <% unless show_application_name %> <%= passed_components[:component_numbers][:print_stylesheet] %> <% end %> - JS + + JS <% unless show_application_name %> <%= passed_components[:component_numbers][:javascript] %> <% end %> - Test + + JS test <% unless show_application_name %> - <%= passed_components[:component_numbers][:test] %> + <%= passed_components[:component_numbers][:javascript_test] %> <% end %> - JS test + + GF CSS <% unless show_application_name %> - <%= passed_components[:component_numbers][:javascript_test] %> + <%= passed_components[:component_numbers][:uses_govuk_frontend_css] %> <% end %> + + GF JS + <% unless show_application_name %> + <%= passed_components[:component_numbers][:uses_govuk_frontend_js] %> + <% end %> + + Test + <% unless show_application_name %> + <%= passed_components[:component_numbers][:test] %> + <% end %> + Helper <% unless show_application_name %> <%= passed_components[:component_numbers][:helper] %> @@ -65,7 +80,7 @@ <% if component[:template_exists] %> - + <%= component[:template_lines] %> lines of code in <%= component[:name] %> template @@ -73,7 +88,7 @@ <% if component[:stylesheet_exists] %> - + <%= component[:stylesheet_lines] %> lines of code in <%= component[:name] %> stylesheet @@ -81,36 +96,52 @@ <% if component[:print_stylesheet_exists] %> - Yes + + Yes + <% end %> <% if component[:javascript_exists] %> - + <%= component[:javascript_lines] %> lines of code in <%= component[:name] %> javascript <% end %> - <% if component[:test_exists] %> - - <%= component[:test_lines] %> - lines of code in <%= component[:name] %> test - - <% end %> - <% if component[:javascript_test_exists] %> - + <%= component[:javascript_test_lines] %> lines of code in <%= component[:name] %> javascript test <% end %> + <% if component[:uses_govuk_frontend_css] %> + + Yes + + <% end %> + + <% if component[:uses_govuk_frontend_js] %> + + Yes + + <% end %> + + <% if component[:test_exists] %> + + <%= component[:test_lines] %> + lines of code in <%= component[:name] %> test + + <% end %> + <% if component[:helper_exists] %> - + <%= component[:helper_lines] %> lines of code in <%= component[:name] %> helper diff --git a/spec/component_guide/audit_applications_spec.rb b/spec/component_guide/audit_applications_spec.rb index 84cbd66f6f..be180ab6ac 100644 --- a/spec/component_guide/audit_applications_spec.rb +++ b/spec/component_guide/audit_applications_spec.rb @@ -198,6 +198,8 @@ stylesheet: 1, template: 15, test: 0, + uses_govuk_frontend_css: 0, + uses_govuk_frontend_js: 0, }, }, } diff --git a/spec/component_guide/audit_components_spec.rb b/spec/component_guide/audit_components_spec.rb index 45d0c6c22c..57510e8ba4 100644 --- a/spec/component_guide/audit_components_spec.rb +++ b/spec/component_guide/audit_components_spec.rb @@ -41,7 +41,7 @@ template_lines: 7, template_link: "https://github.com/alphagov/govuk_publishing_components/blob/main/app/views/govuk_publishing_components/components/_test_component.html.erb", stylesheet_exists: true, - stylesheet_lines: 4, + stylesheet_lines: 6, stylesheet_link: "https://github.com/alphagov/govuk_publishing_components/blob/main/app/assets/stylesheets/govuk_publishing_components/components/_test-component.scss", print_stylesheet_exists: true, javascript_exists: true, @@ -56,6 +56,7 @@ helper_exists: true, helper_lines: 6, helper_link: "https://github.com/alphagov/govuk_publishing_components/blob/main/lib/govuk_publishing_components/presenters/test_component_helper.rb", + uses_govuk_frontend_css: true, }, { name: "test component containing other component", @@ -64,16 +65,26 @@ template_exists: true, template_lines: 3, template_link: "https://github.com/alphagov/govuk_publishing_components/blob/main/app/views/govuk_publishing_components/components/_test_component_containing_other_component.html.erb", + print_stylesheet_exists: false, + stylesheet_exists: true, + stylesheet_lines: 4, + stylesheet_link: "https://github.com/alphagov/govuk_publishing_components/blob/main/app/assets/stylesheets/govuk_publishing_components/components/_test-component-containing-other-component.scss", + javascript_exists: true, + javascript_lines: 4, + javascript_link: "https://github.com/alphagov/govuk_publishing_components/blob/main/app/assets/javascripts/govuk_publishing_components/components/test-component-containing-other-component.js", + uses_govuk_frontend_js: true, }, ], component_numbers: { template: 2, - stylesheet: 1, + stylesheet: 2, print_stylesheet: 1, - javascript: 1, + javascript: 2, test: 1, javascript_test: 1, helper: 1, + uses_govuk_frontend_css: 1, + uses_govuk_frontend_js: 1, }, helper_usage: [ { diff --git a/spec/dummy_gem/app/assets/javascripts/govuk_publishing_components/components/test-component-containing-other-component.js b/spec/dummy_gem/app/assets/javascripts/govuk_publishing_components/components/test-component-containing-other-component.js new file mode 100644 index 0000000000..8c8acbee3a --- /dev/null +++ b/spec/dummy_gem/app/assets/javascripts/govuk_publishing_components/components/test-component-containing-other-component.js @@ -0,0 +1,4 @@ +// this file is needed to test the component auditing +// = require govuk/components/notarealcomponent/notarealcomponent.js + +var thisDoesNothing = 0 diff --git a/spec/dummy_gem/app/assets/stylesheets/govuk_publishing_components/components/_test-component-containing-other-component.scss b/spec/dummy_gem/app/assets/stylesheets/govuk_publishing_components/components/_test-component-containing-other-component.scss new file mode 100644 index 0000000000..64b2293b8e --- /dev/null +++ b/spec/dummy_gem/app/assets/stylesheets/govuk_publishing_components/components/_test-component-containing-other-component.scss @@ -0,0 +1,4 @@ +// this file is needed to test the component auditing +.test { + background: none; +} diff --git a/spec/dummy_gem/app/assets/stylesheets/govuk_publishing_components/components/_test-component.scss b/spec/dummy_gem/app/assets/stylesheets/govuk_publishing_components/components/_test-component.scss index 5484146de6..dd7d68f81c 100644 --- a/spec/dummy_gem/app/assets/stylesheets/govuk_publishing_components/components/_test-component.scss +++ b/spec/dummy_gem/app/assets/stylesheets/govuk_publishing_components/components/_test-component.scss @@ -1,4 +1,6 @@ // this file is needed to test the component auditing +@import "govuk/components/accordion/accordion"; + @include govuk-media-query($media-type: print) { .test {} }