I build a web app using Vue.js2 and Sass packed with webpack, transpiled with Babel. The backend is build with PHP framework Symfony2.
I have full support for browsers based on webkit - Chrome, Opera, Firefox, Edge, however, I did everything to make sure it's compatible with IE11, I have some issues on production and testing env (both run under apache2). CSS are autoprefixed by webpack plugin and PostCSS.
While I run the server locally using PHP built-in server, everything works perfectly. While I launch the app from server with apache, in Webkit browsers, everything works perfectly as well. Now the interesting part is, IE 11 is not able to load complete asset files. CSS are broken and barely half of the page is styled up. Also the Javascripts are incomplete, that causes missing fc declaration and nothing is rendered due to errors.
This occurs only in IE11. We have F5 firewall on production, also internal proxy in our company's network. But since the problem is only IE11 related, I don't think the problem lays there.
Do you have any idea, where's the problem? Can apache modify headers to be incompatible with IE11?
Related
While using Next.js + Tailwind + DaisyUI in development on Mac everything works as expected and all styles look normal, however when developing on WSL I noticed that my styles look very different and are pretty much broken from what I would expect. I'm encountering this same issue when deploying my site to Vercel. Does anyone know how I can resolve this?
Development (Mac)
Deployment (Vercel)
tailwind.config.js
I attempted to recreate the issue on my mac with no luck, however it seems this issue is showing up on Linux and Vercel deployment.
Update:
Turns out the issue stemmed from the fact that I had a css file in my styles folder and when I imported it into my homepage, it messed up the styling for everything else.
Not sure if this is supposed to be the expected behavior, but it did solve the issue
I have an application that is using GWT 2.0.4 and running fine on IE8 browser. When opened in IE11, it is giving blank page with error message given below.
com.google.gwt.core.client.JavaScriptException : (TypeError) : Object doesn’t support property or method ‘attachEvent’
The exception was thrown because “attachEvent” is a deprecated function used in older versions of Internet Explorer. IE11 uses “addEventListener” method instead of “attachEvent”.
The user.agent value was set to "ie6" so i changed it to "gecko1_8". After changing user agent it opens the application but the data in table(GWT-ext GridPanel) is getting overlapped over one another, scrollbars are missing and the alignment of menu bar is changed.
It is working fine after enabling the compatibility mode. What is the proper workaround to run my app in IE11 ? Do i need to upgrade GWT and if yes then to which version supports IE11? I don't have to use "X-UA-Compatible=IE8" meta tag....Please help
As with anything on the Web, you should always try to run the latest version, because everything changes around your application. 2.0.4 is 5 years old already!
So yes, upgrade to the latest version of GWT (2.7.0 as of today), and when the next version will come (2.8, in a few weeks) try to upgrade as well.
As a workaround, because it works in IE8, you could probably ask IE11 to emulate it using an X-UA-Compatible with value IE=EmulateIE8. But that's only a temporary workaround, as the next version (Edge, coming in Windows 10 to replace IE) will no longer support X-UA-Compatible (except in the Intranet zone). See the warning at the top of the X-UA-Compatible doc and this announcement by Mirosoft. The real solution is to stay up-to-date with GWT versions, just like you stay up-to-date with browser versions.
I am running Debian Wheezy. I am playing with gulp last few days. My problem is that when I point browser to file directly (file:///...) source maps linked correctly like this:
But when I point with localhost/... I get this:
On Iceweasel everything works perfectly. I triple checked all settings, so that part is OK. I thought it might be some security issue, so I chmod recursively project root, but that is not the issue.
This is my folder structure:
This is my gulpfile.js:
I got scss files that look like this:
index.scss
_test.scss
When I run gulp command on root folder I get:
index.css
Can it be some Chromium issue? I tried doing almost everything I could think of. The fact that it's working on Iceweasel makes me think it's specific Chromium problem, but it's so hard to give up. :D
I had experienced the similar issue, especially with BrowserSync.
Version Info:
OS X El Capitan#10.11.12
Google Chrome#47.0.2526.80 (64-bit)
browser-sync#2.9.0
Description
Chrome could not autoload Scss sourcemaps watched by BrowserSync, while Chrome private mode, Chrome Canary, Safari works with Scss sourcemaps correctly whether using BrowserSync or python simple HTTP server command line.
The solution may be specific to my case. I tried Google Web Starter Kit(#0.6.0)'s Service-Worker previously, so I went to chrome://serviceworker-internals and unregistered items listed in that page.
It's done. Soucemaps work as expected again.
Try adding your local folder in chrome workspace. Here is a perfect tutorial on enabling and using workspaces:
http://www.sitepoint.com/using-source-maps-debug-sass-chrome/
Hope it helps.
I have a Ransack search and Foundation in my Rails app and locally css renders ok while the same app in production has a quirk:
other things in the app are exactly the same.
I tested in Chrome and Safari - locally ok, production not ok.
Where can I start troubleshooting this?
UPDATE: I tried to run in production locally (assets:precompile) and it's the same as on the server... so how come asset compilation can change something?
One of the sites probably has a global css selector that set the margin or padding (can't really tell from your example).
Go to the production site and inspect one of the elements. You should see a difference in its computed style.
Ok, so here is the issue we are having. We have a website that uses a DevExpress callback panel. We have gotten calls from users using IE10 that the page is blank.
I setup a machine with IE10 - to try and replicate the problem. When logging into the production website, I saw the same thing – the page is blank, except that you can see an empty SpitterControl up in the top left corner (indicating a control with nothing in it). I checked the f12 developer tools, all of the markup is there. Also, when going to quirks mode, or IE9 mode, page renders fine.
So good so far. The next step is to replicate the issue in my local environment so I can throw in some breakpoints and try to find the cause. Here is where I am stumped. Local dev environment no issue at all; Page renders fine in IE10. I am running IIS7 on my machine with the same .NET framework.
So, on to the next step. We have a machine where we stage code for beta testing – its configuration basically mirrors the production configuration. Same result, all IE10 pages rendered just fine.
I have kind of run out of ideas. I have of course researched the doctype, and forcing the IE9 mode. All things that I could try, but I just puzzled by the fact that all of my testing environments I could not get it to break.
Any thoughts?
Try setting up an offsite dev setup. It could be that within your domain. I know that in one case we had problems with devexpress controls loading out of order.
Figured it out - well work around anyways. Setting the worked. It just wasn't so simple to just make a change like that to the production database - but I finally got it in there to try it. Jeez.. what a pain!
The NuGet package option from this link worked for me so I assume that installing the hotfix on the server would also work:
http://www.hanselman.com/blog/BugAndFixASPNETFailsToDetectIE10CausingDoPostBackIsUndefinedJavaScriptErrorOrMaintainFF5ScrollbarPosition.aspx
SUMMARY:
Make sure you have NuGet installed
Right click on project then click on Manage NuGet packages
Search Online for "App_BrowsersUpdate"
I installed the one for .net 4
Republish