What are the main differences between running IE10 in desktop mode and metro mode on a windows tablet? - html

I'm debugging a application that runs great on IE10 desktop version on a windows 8 tablet, but when I'm opening the same app in the metro version of IE10, tapping on buttons in the interfaces doesn't seem to work. This has something to do with how IE10 handles the taps on the screen.
Is there a clear and complete list of differences between IE10 in metro mode and IE10 in desktop mode on a touch enabled screen? If yes, what are those differences?

Related

debugging a website on a mobile device

I have a website that uses (except for other things) AngularJS. This website works perfectly fine on (example):
Google Chrome
IE
Firefox
iOS
Android
However I am having problems with Windows 10 mobile as one of the features is not working correctly (to be more precise it is $interval).
When testing my app on one of the browsers I view website via Web Inspector and go to background code to inspect where exactly the app fails. However I have no idea how to fix the problems that occur on mobile devices - such as Windows 10 Mobile?
How can one debug websites on a mobile device?
Windows 10 Mobile has Edge Browser. Try debugging it in that.
This is might be helpful.
https://developer.microsoft.com/en-us/microsoft-edge/platform/documentation/f12-devtools-guide/
for the debugging tool you can use
https://msdn.microsoft.com/library/dn255001(v=vs.85).aspx

Is there ANY way to see chrome iOS CSS?

So, I'm building responsive pages using the Chrome dev tools iOS emulator, only to find that there's a 5% difference when you check it out on an actual phone.
All my css is normalized and has the latest vendor prefixes, so I'm stuck with guessing what's going wrong with that last 5%.
Surely there is a way to see the CSS output on a mobile device? Dev-tools for mobile. Surely!
On Android phones, Chrome does support Remote Debugging over USB
Since you're in iOS, though, you are able to use Safari's remote debugging feature to try to debug the page. Chrome for iOS uses Apple's UIWebView to render pages, so debugging in iOS Safari should give you the same results you're seeing in iOS Chrome.
Safari's remote debugging feature can be used by going to Settings > Safari > Advanced on your device, connecting the device to the computer via USB, then in Safari on your Mac, go to Develop > [Device] > [website] to debug.

Debugging on iOS safari

I'm making my portfolio website and I'm using pure HTML 5 no .js the about page doesn't work on iPhone and doesn't scroll everything together some of the elements positions are fixed and don't scroll. I don't own an iPhone but is there anyway to simulate the iOS on computer so I can debug the page? And is there such a tool like "inspect element" in chrome on the iOS safari? If not how can I debug and find how the browser is rendering wrong on the phone? Cause I validated my code and it's supposed to work, but its not!
You can simulate iOS using Xcode and Mac OS.
And for the debug purpose there is no inspect element in Simulator. Yes you can take a help of Accessibility Inspector
In the Simulator >> Go to Settings >> General >> Accessibility
Turn on Accessibility Inspector - This will help you to inspect different elements.
Something important to bear in mind is that because of Apple's policies, all browsers must use Safari’s layout engine to render pages, that means there are very few differences in rendering a page between Safari and other browsers on iOS.
There are two methods that you can use to debug a web page running on your iOS device on your using a browser on your Mac or Windows computer:
1. Debug using a Mac
If you have a Mac, you already have tools to live-inspect and debug web pages on your iOS device.
See here: https://developer.apple.com/library/safari/documentation/AppleApplications/Conceptual/Safari_Developer_Guide/Introduction/Introduction.html
2. Debug using Windows
Xcode and MacOS are not the only way to debug websites running in a browser on OSX. There's a few ways:
Telerik
WineRE
I personally use Edge Inspect when I'm forced to use Windows.
Adobe Edge Inspect
http://www.adobe.com/devnet/edge-inspect/articles/browser-testing-across-devices-with-adobe-edge-inspect.html

How to emulate the latest versions of Internet Exporer Mobile

I need to test a mobile website using the latest version of IE Mobile, but i don't want to install the windows phone emulator because i think it's too heavy for my PC and i don't want to install a whole OS only to view some web pages.
I am looking for a browser emulator or a plugin if IE desktop.
The best solution i found at the moment is to change User Agent String on IE10.
Press F12
Click on "Tools"
Click on "Change user Agent String"
Select IE10 for Windows Phone 8

Chrome browser on Windows 8 desktop: touch support error

Chrome browser (version 23.0.1271.97) on Windows 8 desktop is erroneously recognized as supporting touch events. Actually it is a desktop, that is to say, it doesn't support touch events.
See for example Modernizr Touch tests: http://modernizr.github.com/Modernizr/touch.html
Did anybody run into this problem?
Is there a solution or a workaround?