Blank screen after importing feeds from Google Reader

[kprivat]

After I imported my feeds from Google Reader, the main page is blank. I can view a list of the feeds in Settings > Feeds, so I'm assuming they have imported correctly.

[mikrotom]

Do you use IE and Win 8? My issue appears the same way. Try to view your Feedbin via other browser or on different device. https://github.com/feedbin/support/issues/169

[kprivat]

This is strange. Ok, I've tried it on IE and Opera with Windows 7 and it doesn't work for either. I tried it on my iPhone and it works fine (and it looks like it works on your iPad). Could this be a Windows issue? I've never heard of that.

[Zegnat]

Some versions of IE seem to work, others do not, the bug has not yet been found:

• 10 for IE 10 on Windows RT (said to work on Windows 8)

• #6 for IE 9 on Windows 7.

Could you please tell us exactly what combination of Windows and IE versions you use?

For now Chrome (or other WebKit based browsers) or Firefox (or possibly other Gecko based browsers) are recommended. Opera will not be supported in its current version so you picked the ‘wrong’ secondary browser. Opera will update to WebKit (Blink, actually) in upcoming versions and if you download Opera Next all is well:

[mikrotom]

I use: Windows 8 Pro with Media Center x64 (fully updated) IE 10.0.9200.165780 in 32 bit Nothing displays - only white empty space inside of box for feeds and content.

[Zegnat]

So far it looks like we have this:

Version	OS	Working
IE 10	Windows 8 Enterprise	✓ Yes	Reported by jasonsandys.
IE 10	Windows 8 Pro	✗ No	Reported by mikrotom. (Screenshot.)
IE 10	Windows 8 RT	✗ No	Reported by jasonsandys.
IE 10	Windows 7	✗ No	Reported by roomanitarian.
IE 9	Windows 7	✗ No	Reported by jaseodonnell. (Screenshot included.)
IE 9	Windows Phone 7.5	✓ Yes	Does not show icons, reported by frenkel.

[gavanm]

Also receiving this error (just signed up)

OS: Win 7 Ultimate SP1, 64 bit Main Browser: Opera (as per your earlier note), it doesn't work. Alternate Browser: IE 10, Version 10.0.9200.16576 (And opera too, though you've already indicated that that won't work) Just Installed Chrome 27.0.1453.110 (Official Build 202711), and it works. Just Installed Opera Next 15.0.1147.61, and it works.

Screen Shot:

Other interesting thing is that under the IE developer tools console, i see:

• HTML1116: X-UA-Compatible META tag ('chrome=1') ignored because of earlier X-UA-Compatible META tag ('chrome=1'). feedbin.me
• SEC7118: XMLHttpRequest for https://polyptych-feedbin.herokuapp.com/panels/3da40925d8718e62f076905e3fb2804341aeeb23/status required Cross Origin Resource Sharing (CORS). feedbin.me

Not sure if they're related or not.

Cheers.

Gavan.

[Zegnat]

HTML1116: X-UA-Compatible META tag ('chrome=1') ignored because of earlier X-UA-Compatible META tag ('chrome=1'). feedbin.me

This is more of a warning than anything else. Apparently somewhere along the line Feedbin is telling IE twice to try and use Chrome frame when available.

SEC7118: XMLHttpRequest for https://polyptych-feedbin.herokuapp.com/panels/3da40925d8718e62f076905e3fb2804341aeeb23/status required Cross Origin Resource Sharing (CORS). feedbin.me

This is the more interesting of the two. Apparently IE cannot load the status due to the Heroku server blocking requests from the Feedbin domain. @gavanm, do you have the ability to check request and response headers? I have attached a screenshot of the headers in Chrome below (minus some possibly identifying information) and highlighted two important lines. Maybe IE is messing up the headers somewhere along the way and therefore not getting anything.

[gavanm]

Sure! Sorry about the delay - the computer with IE 10 stays at work on the weekends.

I'm not sure if I have the right URL, but here's the one that shows up in the error url. What's odd is that it's returning 200!

REQUESTED URL: https://polyptych-feedbin.herokuapp.com/panels/3da40925d8718e62f076905e3fb2804341aeeb23/status

REQUEST HEADERS:

RESPONSE HEADERS:

RESPONSE BODY:

And for good measure, here's the network view of things:

I've saved an XML file of all the HTTP call request response body etc information. Though since it probably contains some cookies for my logins, etc - If you want it I'd prefer to send directly (if we can figure out a mechanism to do so - I'm not sure if GitHub as a personal message facility) - it's about 500kb zipped.

[benubois]

polyptych-feedbin.herokuapp.com is a favicon service so this request failing should not affect anything but loading favicons.

Feedbin is currently broken in Internet Explorer. I hope to support IE 10 eventually but it hasn't been a high priority because of the low usage I'm seeing.

[Zegnat]

Well, I’ve got nothing. All CORS headers seem to be sent and received so I have no idea why it would throw an XMLHttpRequest error in the console…

[gavanm]

Wow - that is very low! I wonder if there is an overlap between the user base (I'm guessing most, but not all, heavy RSS users are probably also power users) and the browser.

Given the low volume of users, I'm happy to ignore this (I've upgraded to Opera Next) - however if you want me to keep helping, I'm happy to do so.

I've done a little more playing around with the debug tools (i'm not really much of a CSS person) and it might be a CSS issue of some kind. The CORS error might be a distraction.

I found that if I disable the .feeds:23b941a1c85fca20a142edddb3d63185.css style for the [div class="feeds"], then things start to show up.

Before Disabling:

After Disabling CSS:

[benubois]

@gavanm appreciate your understanding and help so far.

That's an interesting find about disabling the favicon style.

If you're interested in working on this I wouldn't say no to any help getting the CSS working for IE :)

[gavanm]

I'll see what I can figure out (I need to get a bit better at CSS - though looking at the CSS file it's huge!) in my spare time.

I'll probably frequently refer to my previous comment about not being very good at CSS!

I should at least be able to figure out what to disable to get something working - though might still not be as attractive as chrome based browsers - at least then there will be some functionality.

Having a quick look, it's the same thing for the: [div class="entries"] - disable the CSS (looks like the same file) and everything starts working again. Doesn't affect the [div class="entry-content"] though (doesn't need it - still working).

Hooray!

So now (as a first step) I need to find out more about conditional CSS based on browser typing...

Do you guys have any idea? Do you have to handle this elsewhere in the application for mozilla vs chrome? (browser specific CSS?)

[mikrotom]

@benubois "I hope to support IE 10 eventually but it hasn't been a high priority because of the low usage I'm seeing. "

It is pretty huge traffic if you consider that Feedbin is not working at all in IE ! I start to pay monthly fee but cannot use it on my desktop and ntb. So i am forced to unsign. Maybe it will be honest to state NOT WORKING WITH IE on homepage of your Feedbin project. It will preserve missunderstandings...

[Zegnat]

@gavanm, great work! Both .feeds and .entries have exactly the same CSS:

.feeds, .entries {
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   right: 0;
   overflow-y: scroll;
   overflow-x: hidden;
   -webkit-overflow-scrolling: touch;
}

So we can assume one of those lines is tripping up IE. Maybe you can disable those properties one-by-one to see which one is the culprit? My personal favourites are the overflow properties. I don’t have access to IE to do this myself at the moment :disappointed:

There is no such thing as conditional CSS ro be honest. The best one can do is use conditional comments to include an extra stylesheet for IE. The optimal solution would be to see if we can create the same styling cross-browser without the specific line that is upsetting IE.

I start to pay monthly fee but cannot use it on my desktop and ntb. So i am forced to unsign.

Please note that you do not actually start paying ’til 3 days after you signed up. This is specifically so people get a short preview period and don’t have to end up paying for something they can’t use.

There is nothing dishonest about the current homepage. Feedbin is not claiming to work in any specific browser. If it weren’t for IE users signing up we would never have been able to get this far debugging the problem!

[gavanm]

Hi @Zegnat, that was the plan! (didn't get the chance last night).

I've made a bit of progess on this.

It looks like it is the "overflow-x" and "overflow-y". BOTH of them need to be disabled for it to work.

Using the developer tools to force the display mode into "IE 10" and "quirks" mode, everything seems to work well.

Only fault I see is that the "Feed or URL" subscribe text box height changes - probably worth it given that everything else works.

This should be fixable with !DOCTYPE attributes (I can't see a way to do it with the dev tools) - though I haven't found the exact one I'm after yet. I'm trying to get a local save of the page working enough to test this out.

Once I have the local save functioning, I can try out different CSS and meta / !DOCTYPE settings to see what works.

I'll let you know how I go.

Useful / Interesting links:

CSS Compatibility in Internet Explorer: http://msdn.microsoft.com/en-us/library/hh781508(v=vs.85).aspx

This Stack Overflow post suggests adding in a meta tag to help with a similar problem: http://stackoverflow.com/questions/11680075/internet-explorer-10-ignores-css-overflowauto-style http://www.nczonline.net/blog/2010/01/19/internet-explorer-8-document-and-browser-modes/

Quick instructions on manually setting quirks mode (could someone else with IE 10) please double check this

1. Open FeedBin.Me
2. Press F12 to show the developer tools
3. In the menu bar, click Document Mode: Standards
4. Choose: Quirks (or press ALT-Q)
5. Switch back to IE window.

RUNNING WITH BROWSER MODE QUIRKS:

[teamshaw]

I'm having the same issue on Windows 7 and IE9.

Quirk mode doesn't resolve, however unchecking overflow-x and overflow-y in the .feeds and .entries part of the CSS tab does. However, then there are no individual scroll bars for the feeds and entries, which makes reading a long list of entries problematic.

[gavanm]

@teamshaw - interesting. I haven't been able to figure this out yet for ie10 - though am downloading the ie9 / win7 app testing VHD to see if I can convert it to run under parallels. Might get it to work yet.

[teamshaw]

Any updates on ie9/10 compatibility?

[Zegnat]

@teamshaw, I have no idea if anyone has been testing the new layout with IE yet. Have you? Are you still seeing problems?

[gavanm]

There are still problems through IE 10 via Parallels.

I'm afraid there are still issues with it. Still haven't been able to figure them out on the old one - might have a look at the new one (work permitting).

[teamshaw]

Cool, thanks guys. It still works by unchecking the overflow-x/y boxes in entries and feeds. Unfortunately my workplace hasn't moved with the times and still uses IE, otherwise this would be a non-issue for me!

[teamshaw]

Did you guys change something today? It works!!!

[benubois]

Yeah should be working in IE 10 now.

[gavanm]

All good for me now! Thanks Ben. Sorry I wasn't able to find it myself. Is there a changeset you can point me to for what you did to fix it?