FIX: Sanitize theme settings properly before injecting into stylesheets (#7031)

lib/stylesheet/importer.rb

@@ -144,9 +144,8 @@ COMMENT
     end
 
     def to_scss_variable(name, value)
-      escaped = value.to_s.gsub('"', "\\22")
-      escaped.gsub!("\n", "\\A")
-      "$#{name}: unquote(\"#{escaped}\");\n"
+      escaped = SassC::Script::Value::String.quote(value, sass: true)
+      "$#{name}: unquote(#{escaped});\n"
     end
 
     def imports(asset, parent_path)

spec/models/theme_spec.rb

@@ -310,6 +310,18 @@ HTML
 
       scss, _map = Stylesheet::Compiler.compile('@import "theme_variables"; @import "desktop_theme"; ', "theme.scss", theme_id: theme.id)
       expect(scss).to include("font-size:30px")
+
+      # Escapes correctly. If not, compiling this would throw an exception
+      setting.value = <<~MULTILINE
+          \#{$fakeinterpolatedvariable}
+          andanothervalue 'withquotes'; margin: 0;
+      MULTILINE
+
+      theme.set_field(target: :common, name: :scss, value: 'body {font-size: quote($font-size)}')
+      theme.save!
+
+      scss, _map = Stylesheet::Compiler.compile('@import "theme_variables"; @import "desktop_theme"; ', "theme.scss", theme_id: theme.id)
+      expect(scss).to include('font-size:"#{$fakeinterpolatedvariable}\a andanothervalue \'withquotes\'; margin: 0;\a"')
     end
 
     it "allows values to be used in JS" do