WIP - add controller for static error pages

app/assets/stylesheets/static-error-pages.scss

@@ -0,0 +1,12 @@
+
+@import "govuk_publishing_components/govuk_frontend_support";
+@import "govuk_publishing_components/component_support";
+
+@import "govuk_publishing_components/components/cookie-banner";
+@import "govuk_publishing_components/components/cross-service-header";
+@import "govuk_publishing_components/components/feedback";
+@import "govuk_publishing_components/components/emergency-banner";
+@import "govuk_publishing_components/components/layout-footer";
+@import "govuk_publishing_components/components/layout-for-public";
+@import "govuk_publishing_components/components/layout-header";
+@import "govuk_publishing_components/components/layout-super-navigation-header";

app/controllers/static_error_pages_controller.rb

@@ -0,0 +1,30 @@
+class StaticErrorPagesController < ApplicationController
+  after_action do
+    response.headers[Slimmer::Headers::SKIP_HEADER] = "true"
+  end
+
+  ERROR_CODES = %w[
+    400
+    401
+    403
+    404
+    405
+    406
+    410
+    422
+    429
+    500
+    501
+    502
+    503
+    504
+  ].freeze
+
+  def show
+    if ERROR_CODES.include?(params[:error_code])
+      render action: params[:error_code], layout: false
+    else
+      head :not_found
+    end
+  end
+end

app/views/static_error_pages/_error_page.html.erb

@@ -0,0 +1,32 @@
+<% content_for :head do %>
+  <%= stylesheet_link_tag "static-error-pages.css", :media => "all", integrity: false %>
+
+  <%= render_component_stylesheets %>
+
+  <%= javascript_include_tag 'test-dependencies.js', type: "module" if Rails.env.test? %>
+  <%= javascript_include_tag 'application.js', integrity: false, type: "module" %>
+<% end %>
+
+<%= render "govuk_publishing_components/components/layout_for_public", {
+  full_width: false,
+  logo_link: Plek.new.website_root.present? ? Plek.new.website_root : "https://www.gov.uk/",
+  show_explore_header: true,
+  title: "#{heading} - GOV.UK",
+} do %>
+  <div id="wrapper" class="govuk-width-container">
+    <main class="govuk-main-wrapper" id="content">
+      <div class="govuk-grid-row">
+        <div class="govuk-grid-column-two-thirds">
+          <h1 class="govuk-heading-xl govuk-!-margin-bottom-8">
+            <%= heading %>
+          </h1>
+          <%= raw intro %>
+          <pre class="govuk-!-margin-top-8">Status code: <%= status_code %></pre>
+        </div>
+      </div>
+    </main>
+  </div>
+  <script>
+    window.httpStatusCode = '<%= status_code %>'
+  </script>
+<% end %>

config/initializers/dartsass.rb

@@ -1,5 +1,6 @@
 APP_STYLESHEETS = {
   "application.scss" => "application.css",
+  "static-error-pages.scss" => "static-error-pages.css",
   "components/_calendar.scss" => "components/_calendar.css",
   "components/_download-link.scss" => "components/_download-link.css",
   "components/_figure.scss" => "components/_figure.css",

config/routes.rb

@@ -83,6 +83,10 @@
     end
   end
 
+  # Static error page routes - in practice used only during deploy, these don't have a
+  # published route so can't be accessed from outside
+  get "/static-error-pages/:error_code.html", to: "static_error_pages#show"
+
   # Simple Smart Answer pages
   constraints FormatRoutingConstraint.new("simple_smart_answer") do
     get ":slug/y(/*responses)" => "simple_smart_answers#flow", :as => :smart_answer_flow

spec/system/static_error_page_spec.rb

@@ -0,0 +1,57 @@
+RSpec.describe "Static Error Pages" do
+  context "When asked for a 4xx page" do
+    it "renders the appropriate page" do
+      visit "/static-error-pages/404.html"
+
+      within "head", visible: :all do
+        expect(page).to have_selector("title", text: "Page not found - GOV.UK", visible: :all)
+        # expect(page).to have_selector("link[href$='application.css']", visible: :all)
+      end
+
+      within "body" do
+        expect(page).to have_selector("#global-cookie-message", visible: :hidden)
+        expect(page).to have_selector("#user-satisfaction-survey-container")
+
+        within "#content" do
+          expect(page).to have_selector("h1", text: "Page not found")
+          expect(page).to have_selector("pre", text: "Status code: 404", visible: :all)
+        end
+
+        within "footer" do
+          expect(page).to have_selector(".govuk-footer__navigation")
+          expect(page).to have_selector(".govuk-footer__meta")
+        end
+      end
+
+      # expect(page).to have_selector("script[src$='application.js']", visible: :all)
+    end
+  end
+
+  context "When asked for a 5xx patge" do
+    it "renders the appropriate page" do
+      visit "/static-error-pages/500.html"
+
+      within "head", visible: :all do
+        expect(page).to have_selector("title", text: "Sorry, we’re experiencing technical difficulties - GOV.UK", visible: :all)
+        # expect(page).to have_selector("link[href$='application.css']", visible: :all)
+      end
+
+      within "body" do
+        expect(page).to have_selector("#global-cookie-message", visible: :hidden)
+        expect(page).to have_selector("#user-satisfaction-survey-container")
+
+        within "#content" do
+          expect(page).to have_selector("h1", text: "Sorry, we’re experiencing technical difficulties")
+          expect(page).to have_selector("pre", text: "Status code: 500", visible: :all)
+        end
+
+        within "footer" do
+          expect(page).to have_selector(".govuk-footer__navigation")
+          expect(page).to have_selector(".govuk-footer__meta")
+        end
+      end
+
+      # expect(page).to have_selector("script[src$='application.js']", visible: :all)
+    end
+  end
+end