Bug: After upgrade to 4.4.0 no icons work [via rails-assets.org]

[klippx]

Hello,

First of all, I am not sure where to open this issue. I am working on a project running on latest version of rails (v4.2.3) with angular v1.2, bootstrap v3.2.0, etc. We are also using font awesome and regularly updating to latest version in every gem. We are doing this via rails-assets.org (rails-assets-fontawesome gem). I know this repo is not the ruby gem repo but still I don't know where else to open this issue.

So the issue is that I am getting these font awesome related errors after upgrading to rails-assets-fontawesome v4.4.0:

Firefox 40.0:

Chrome 44.0.2403.155 (64-bit):

Canary 46.0.2481.0 (64-bit):

Downgrading to rails-assets-fontawesome v4.3.0 solves this issue.

[acshef]

Even though you're accessing stuff from localhost, it seems you're not authorized. Do you have correct permissions set for 4.4.0 (and its folder, etc) ?

[tagliala]

Sorry, I can't help here. It seems a problem on your local machine but I will take a look

[tagliala]

could this be related to #7173 or #7253 ?

[klippx]

I am not using bower, I am using bundler. I am not sure how this gem works, as it comes from rails-assets.org.

However, this problem is not only local, it occurs on my colleagues local machine as well, and on our sandbox and production environments which are both separate/independent ubuntu machines.

The font files in these gems have the same permissions in both 4.3.0 and 4.4.0. However I cannot find anything wrong with the files in either version with the online validator sites I have found.

When I look at Firefox support it seems this message is signalling "bad font": https://support.mozilla.org/en-US/questions/913498

Similar response to Chrome issue also suggest fonts woff files are corrupt:

[not font awesome, but related] https://answers.coveo.com/questions/3401/failed-to-decode-downloaded-font-httpshostresource1430925527000coveosolutions__coveojssearchfontsarimo_normalwoff

http://stackoverflow.com/questions/31001842/fontawesome-failed-to-decode-downloaded-font

[tagliala]

From https://rails-assets.org/

Add https://rails-assets.org as a new gem source, then reference any Bower components that you need as gems in the following convention:

source 'https://rails-assets.org' do
  gem 'rails-assets-BOWER_PACKAGE_NAME'
end

During bundle install, if Bundler requests a package like this, Rails Assets’ daemon automatically will:

• fetch the component from Bower’s registry,
• analyze its manifest file, bower.json,
• repackage the component as a valid Ruby gem and serve it to your application.
  Dependencies are handled the same way recursively.

[tagliala]

There is an issue with paths

rails-assets-font-awesome 4.3.0:

fontawesome.scss (= fontawesome.css renamed to .scss with fixed paths)

  src: font-url("font-awesome/fonts/fontawesome-webfont.eot?v=4.3.0");
  src: font-url("font-awesome/fonts/fontawesome-webfont.eot?#iefix&v=4.3.0") format('embedded-opentype'), font-url("font-awesome/fonts/fontawesome-webfont.woff2?v=4.3.0") format('woff2'), font-url("font-awesome/fonts/fontawesome-webfont.woff?v=4.3.0") format('woff'), font-url("font-awesome/fonts/fontawesome-webfont.ttf?v=4.3.0") format('truetype'), font-url("font-awesome/fonts/fontawesome-webfont.svg?v=4.3.0#fontawesomeregular") format('svg');

rails-assets-font-awesome 4.4.0:

font-awesome/_path.scss

  src: url('#{$fa-font-path}/fontawesome-webfont.eot?v=#{$fa-version}');
  src: url('#{$fa-font-path}/fontawesome-webfont.eot?#iefix&v=#{$fa-version}') format('embedded-opentype'),
    url('#{$fa-font-path}/fontawesome-webfont.woff2?v=#{$fa-version}') format('woff2'),
    url('#{$fa-font-path}/fontawesome-webfont.woff?v=#{$fa-version}') format('woff'),
    url('#{$fa-font-path}/fontawesome-webfont.ttf?v=#{$fa-version}') format('truetype'),
    url('#{$fa-font-path}/fontawesome-webfont.svg?v=#{$fa-version}#fontawesomeregular') format('svg');

Workaround

Do not require font-awesome in your application.css and add font-awesome.scss to your asset pipeline:

@import "font-awesome/variables";
@import "font-awesome/mixins";

/* Path fix */
@font-face {
  font-family: 'FontAwesome';
  src: font-url("font-awesome/fonts/fontawesome-webfont.eot");
  src: font-url("font-awesome/fonts/fontawesome-webfont.eot?#iefix") format('embedded-opentype'), font-url("font-awesome/fonts/fontawesome-webfont.woff2") format('woff2'), font-url("font-awesome/fonts/fontawesome-webfont.woff") format('woff'), font-url("font-awesome/fonts/fontawesome-webfont.ttf") format('truetype'), font-url("font-awesome/fonts/fontawesome-webfont.svg#fontawesomeregular") format('svg');
  font-weight: normal;
  font-style: normal;
}

@import "font-awesome/core";
@import "font-awesome/larger";
@import "font-awesome/fixed-width";
@import "font-awesome/list";
@import "font-awesome/bordered-pulled";
@import "font-awesome/animated";
@import "font-awesome/rotated-flipped";
@import "font-awesome/stacked";
@import "font-awesome/icons";

I think this issue is related to #6227 but I don't know how to fix this, sorry

As about bower, we are following their specs.

Leaving this open

[joaocc]

Same issue with gulp. Workarounded via downgrade to v3.2.1.

[fruwe]

Thanks @tagliala for your workaround. I tried it and it was indeed working, but only after trying for several seconds other font files.

Now I am using this workaround which is easy and quick:

$fa-font-path: "font-awesome/fonts";
@import "font-awesome";

[tagliala]

Closing here, please use $fa-font-path if you don't want to use the gem file