Question

I’ve got a strange error in Rails using Sass/Css:

“1p*x isn’t a valid CSS value.”

The application trace says it comes from:

app/assets/stylesheets/shared/form.css.scss:19

But in my file, this line is:

“input{@include all_borders(1px, solid, red);}”

It’s like something is adding a ” * ” between p and x. And, it does the same issue with lot’s of other lines. And… the error just came out, I never had it before, I didn’t change anything in my config files, the only thing I did was to update my gems using bundle update.

[Edit] The Mixin code:

@mixin all_borders($strength: 1px, $type: solid, $color: black){
  border: $strength $type $color;
}

[End Edit]

I also have some “wrong number of arguments (4 for 1)” issues… But again, everything worked fine yesterday… It’s like something is wrong with the precompilation of my scss files… I have the same issue when trying to precompile.

Does anyone have a clue? I don’t know what to do…

If it may help: I’m using Ruby 1.9.3, Rails 3.2.3, sass 3.1.15 and sass-rails 3.2.5, I also post my application.rb & development.rb files:

development.rb
config.cache_classes = false

config.whiny_nils = true

config.consider_all_requests_local       = true
config.action_controller.perform_caching = false

config.action_mailer.raise_delivery_errors = true

config.active_support.deprecation = :log

config.action_dispatch.best_standards_support = :builtin

config.active_record.mass_assignment_sanitizer = :strict

config.active_record.auto_explain_threshold_in_seconds = 0.5

config.assets.compress = false
config.serve_static_assets = false

config.assets.debug = true

application.rb

require File.expand_path('../boot', __FILE__)

require 'rails/all'

if defined?(Bundler)
  Bundler.require(*Rails.groups(:assets => %w(development test)))
end

module MySite
  class Application < Rails::Application
    config.autoload_paths += %W(#{config.root}/lib)

    config.encoding = "utf-8"

    config.assets.enabled = true
    config.assets.initialize_on_precompile = false

    config.assets.version = '1.0'

  end
end

Thanks in advance for taking time to help me. 🙂

Answer 1

Okay I found what the problem was… Pfiew, that was a tough one to find…

I had to create a whole new project, adding the code of my broken one, file by file and tracking the occurrence of the issue thanks to the Rails server.

So I discovered that deleting this file:
/config/initializers/custom_libraries.rb

Was solving the issue. This file had only one line: require ‘ext/string’

So the problem had to come from my custom string methods.

And yes it did. I was adding a “to_a” (to_array) method to the string class because the native Ruby string class doesn’t have this method. The method was:

def to_a
  return self.chars.to_a
end

So commenting this method solved my CSS issues. I imagine that the sass-rails gem or CSS related ones is already creating this method and use it for compilation or other CSS stuff and my “to_a” string method surely messed things up. But I’m only guessing…

Surely the Rails errors weren’t helpful at all to find this out. Does anyone know how I may have found the issue faster? Maybe a specific debug tool to recommend?

I will learn from this misadventure: never ever create your own method for a specific Ruby class with a name that is too similar with other Ruby class methods.