When a Google font is enabled — in my case, with Google Fonts module — CSS files don't load in ACE editor.

Console messages when, for example, Kranky font is activated on example.com:
On load:
XMLHttpRequest cannot load http://fonts.googleapis.com/css?family=Kranky. Origin http://example.com is not allowed by Access-Control-Allow-Origin.

When a CSS file is selected:
TypeError: 'null' is not an object (evaluating 'this.editor.getSession')

CommentFileSizeAuthor
#10 1262000-external-google-fonts-10.patch457 bytesfizk

Comments

guybedford’s picture

guybedford commented

I included the font with the following tag - 

<link href='http://fonts.googleapis.com/css?family=Kranky' rel='stylesheet' type='text/css'>

And Live CSS still worked fine for me.

Are you using a different form of the include?

pomliane’s picture

pomliane commented

Thank you for this answer.

Google Fonts module adds this exact line:
<link type="text/css" rel="stylesheet" href="http://fonts.googleapis.com/css?family=Kranky" />

The same issue happens with other fonts activated via Google Fonts module, but everything seems fine when the font is manually included.

So, maybe not the right issue queue?

guybedford’s picture

guybedford commented

Actually live css will be loading all the css files in the page using ajax requests to read in their content. It then tries to load the font css file, which causes the origin policy issue, and returns an error. This isn't caught properly which causes things to stop working. I believe it worked fine when I tried because I didn't have the origin policy issue running it off a live site.

I'll look into having a better fail on those ajax requests so that the file effectively isn't editable.

Thanks for reporting this issue - will hopefully have something on it soon.

brankolo’s picture

brankolo commented

The same problem for me.
Waiting for solution, thanks in advance

guybedford’s picture

guybedford commented
Status: Active » Needs review

I believe I may have fixed this issue with the latest (2.0) version of the module.

Let me know if that works for you.

pomliane’s picture

pomliane commented
Version: 6.x-1.7 » 6.x-2.0
Status: Needs review » Needs work

Thank you guybedford for the follow up!

It seems, 6.x-2.0 does not solve the issue when http://drupal.org/project/fontyourface is in use.

Anonymous’s picture

Anonymous (not verified) commented

this does not solve the fontyourface issue , but I have to say that using cufon instead of fontyourface is a much better way to display fonts on a site. Fonts are a lot cleaner across browser types http://drupal.org/project/cufon

guybedford’s picture

guybedford commented
Status: Needs work » Closed (fixed)

I believe this has been fixed by recent changes, if not feel free to reopen.

fizk’s picture

fizk commented
Version: 6.x-2.0 » 6.x-2.3
Issue summary: View changes
Status: Closed (fixed) » Active

I'm getting this error with 6.x-2.3, which is also the latest dev for 6.x.

fizk’s picture

fizk commented
Status: Active » Needs review
StatusFileSize
new 1262000-external-google-fonts-10.patch457 bytes

Here's a patch. The same fix should work for 7.x.

deryck.henson’s picture

deryck.henson commented
Assigned: Unassigned » deryck.henson
Status: Needs review » Closed (fixed)
Issue tags: +Google Fonts

Thank you for the patch @fizk.

I tested to make sure that's all that was needed and sure enough, everything works well now.

Applied to 7.x-2.x and 6.x-2.x branches.