Merge 547ab5d into 698b4c6

.github/workflows/release.yml

@@ -48,10 +48,14 @@ jobs:
       run: |
         bundle exec gem bump better_errors --version ${{ steps.get_version.outputs.version }} --no-commit
 
+    - name: Compile CSS
+      run: |
+        bundle exec rake style:build
+
     - name: Build gem
       run: gem build better_errors.gemspec
 
-    - name: Upload gem to Release
+    - name: Add gem to GitHub Release
       uses: actions/upload-release-asset@v1
       env:
         GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}

.gitignore

@@ -9,3 +9,7 @@
 
 /gemfiles/*.gemfile.lock
 /gemfiles/.bundle
+
+
+# No CSS is committed. In development, the SCSS is used. The CSS is compiled when building a gem release.
+*.css

Rakefile

@@ -1,5 +1,6 @@
 require "bundler/gem_tasks"
 require "rspec/core/rake_task"
+require "better_errors/error_page_style"
 
 RSpec::Core::RakeTask.new(:test)
 task :default => :test
@@ -36,3 +37,18 @@ namespace :test do
     with_each_gemfile { sh "bundle exec rspec" rescue nil }
   end
 end
+
+namespace :style do
+  desc "Build main.css from the SASS sources"
+  task :build do
+    css = BetterErrors::ErrorPageStyle.compiled_css(true)
+    File.open(File.expand_path("lib/better_errors/templates/main.css", File.dirname(__FILE__)), "w") do |f|
+      f.write(css)
+    end
+  end
+
+  desc "Remove main.css so that the SASS sources will be used directly"
+  task :develop do
+    File.unlink File.expand_path("lib/better_errors/templates/main.css", File.dirname(__FILE__))
+  end
+end

better_errors.gemspec

@@ -12,9 +12,9 @@ Gem::Specification.new do |s|
   s.homepage      = "https://github.com/BetterErrors/better_errors"
   s.license       = "MIT"
 
-  s.files         = `git ls-files -z`.split("\x0").reject do |f|
-    f.match(%r{^((test|spec|features|feature-screenshots)/|Rakefile)})
-  end
+  s.files         = `git ls-files -z`.split("\x0").reject { |f|
+    f.match(%r{^((test|spec|features|feature-screenshots)/|Rakefile)|\.scss$})
+  } + %w[lib/better_errors/templates/main.css]
 
   s.require_paths = ["lib"]
 
@@ -25,6 +25,7 @@ Gem::Specification.new do |s|
   s.add_development_dependency "rspec-html-matchers"
   s.add_development_dependency "rspec-its"
   s.add_development_dependency "yard"
+  s.add_development_dependency "sassc"
   # kramdown 2.1 requires Ruby 2.3+
   s.add_development_dependency "kramdown", (RUBY_VERSION < '2.3' ? '< 2.0.0' : '> 2.0.0')
   # simplecov and coveralls must not be included here. See the Gemfiles instead.

lib/better_errors/code_formatter.rb

@@ -42,7 +42,7 @@ def each_line_of(lines, &blk)
     end
 
     def highlighted_lines
-      CodeRay.scan(context_lines.join, coderay_scanner).div(wrap: nil).lines
+      CodeRay.scan(context_lines.join, coderay_scanner).html(css: :class).lines
     end
 
     def context_lines

lib/better_errors/code_formatter/html.rb

@@ -8,7 +8,7 @@ def source_unavailable
     def formatted_lines
       each_line_of(highlighted_lines) { |highlight, current_line, str|
         class_name = highlight ? "highlight" : ""
-        sprintf '<pre class="%s">%s</pre>', class_name, str
+        sprintf '<pre class="CodeRay %s">%s</pre>', class_name, str
       }
     end
 

lib/better_errors/error_page.rb

@@ -1,6 +1,7 @@
 require "cgi"
 require "json"
 require "securerandom"
+require "better_errors/error_page_style"
 
 module BetterErrors
   # @private

lib/better_errors/error_page_style.rb

@@ -0,0 +1,30 @@
+require "sassc"
+
+module BetterErrors
+  # @private
+  module ErrorPageStyle
+    def self.compiled_css(for_deployment = false)
+      style_dir = File.expand_path("style", File.dirname(__FILE__))
+      style_file = "#{style_dir}/main.scss"
+
+      engine = SassC::Engine.new(
+        File.read(style_file),
+        filename: style_file,
+        style: for_deployment ? :compressed : :expanded,
+        line_comments: !for_deployment,
+        load_paths: [style_dir],
+      )
+      engine.render
+    end
+
+    def self.style_tag(csp_nonce)
+      style_file = File.expand_path("templates/main.css", File.dirname(__FILE__))
+      css = if File.exist?(style_file)
+        File.open(style_file).read
+      else
+        compiled_css(false)
+      end
+      "<style type='text/css' nonce='#{csp_nonce}'>\n#{css}\n</style>"
+    end
+  end
+end

lib/better_errors/middleware.rb

@@ -119,8 +119,8 @@ def show_error_page(env, exception=nil)
           # for older browsers without nonce support.
           # https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src
           "script-src 'self' 'nonce-#{csp_nonce}' 'unsafe-inline'",
-          # Inline style is required by the syntax highlighter.
-          "style-src 'self' 'unsafe-inline'",
+          "style-src 'self' 'nonce-#{csp_nonce}' 'unsafe-inline'",
+          "img-src data:",
           "connect-src 'self'",
           "navigate-to 'self' #{BetterErrors.editor.scheme}",
         ].join('; '),