I wish to implement the suggestion in this post:
Visual Studio 2012 Mobile Device Emulators
but Opera Mobile Emulator seems to no longer come in a Windows version. Anyone else experiencing this issue?
Yes, that's not just you.
People at Opera forums discovered a direct link to the Windows version:
http://www.opera.com/download/get.pl?sub=++++&id=35131
Considering that the link in the article on this topic has no mention of the Opera Mobile Emulator, I concluded that the desktop version is no longer supported. However, all major browsers have a built-in mobile emulator in the developer tools.
For Opera, these are the steps to access it:
Select the tab with the web page to be tested
Open Menu > Developer > Developer Tools or CTRL + SHIFT + I
Select the "Toggle device toolbar" icon at the top left (looks like a phone next to a tablet)
Select the device from the first drop-down menu on the toolbar. It will be "Responsive" by default, or the last device used.
It's a similar process on other major browsers, like Chrome, Firefox and Edge. Comparing to physical devices I'd say it's reasonably accurate for testing layouts. It doesn't have the latest phones like iPhone 12 at this time, but you can add a custom device by specifying the viewport height and width.
My understanding is that each browser tests how it would behave on its own mobile version, which means, it's best to test it on the developer tools on all supported browsers. On this topic, there are tips and links to commercial testing tools on the MDN article on cross browser testing. My main take away is test a lot, and fix or provide fallback solutions.
Related
Im currently developing a web app which is mostly in dark colors. The app is operated via touch, so i set my chrome dev tools to emulate a mobile device. The problem is now that the cursor is dark on dark and i find it hard to find the cursor. Is there a way to somehow change the appearance of the mobile cursor?
I'm on windows 10 and have the latest chrome version 107.0.5304.88
I searched the installation files of chrome to somehow find the icon/picture which is used for the cursor but i don't know much about desktop apps so i didn't find anything
Add device type
Mobile (no touch)
When a Windows 10 computer wants to share some of its screens using webrtc protocol (firefox navigator), a list of the windows that can be shared appears. In this list, only "normal" applications appears, not the one related to "apps". By example, spotify window appears, but OneNote window is not listed.
It seems (?) webrtc screen share is not compatible with UWP apps.
Knows someone a way to share the screen of an app via webrtc ?
Note: following link allows to reproduce this issue:
https://mozilla.github.io/webrtc-landing/gum_test.html
you do not need share anything, just push "window" and see the list of windows that appears.
I believe Chromium (the open source version - not sure about Chrome) faces the same problem as UWP requires to use a new Win 10 API which shows it's own window selector. And then obviously that selector doesn't work on other problems. So it's a common problem on Win 10, with no known good solution as far as I can tell.
Joomla automagically recognises the mobile template and displays it on the mobile devices. but sometimes it does not display(very rarely) and also sometimes the behaviour is different(like logo disappearing).
Question:
1) Is there a way we can test the mobile template on the desktop computers (like m.mobilesite.com) so that we can debug the issue?
Yes You can,
The http://www.browserstack.com sites Provide a real machine for testing the device and browser compactability.(It a remote machine so the result is 100%).This required signup.
Also you can check iphone and ipad compactabilty with safari Developer option.
From Settings->Preference ->Advanced ->check the Show Develop menu option.
Now you will get a new menu in the browser Developer there you can choose the user agent.
You can also find several sites that provide mobile testing but those are not 100% sure
like iphone4simulator.com, iphonetester.com
Hope this may help you..
I also found that - If you decrease your browser width and height - it will display mobile format. I am not sure if this is a feature of later versions of joomla. Also on Chrome - developer tools, there is an option to choose the mobile device to test the webpage.
Are there any add-ons to test an HTML page to see what it will look like on a mobile device? I'm developing with PhoneGap but Eclipse emulator is too slow to refresh it all the time so I want to have a browser extension that make screen resolution like on mobile.
If you care only about the screen size, Firefox 15 (currently Beta, release coming up in two weeks) has Responsive Design View in the Web Developer menu that allows you to adjust "screen size". For example, you can select 360x640 (nHD resolution) and have a look at your page.
However, mobile browsers do custom adjustments to web pages and these adjustments depend on the browser used. For example, Firefox Mobile does something called Font Inflation. You cannot reproduce it in a desktop browser, you have to actually run Firefox Mobile for that. The problem: mobile browsers will only run on mobiles, even Mozilla stopped supplying Firefox Mobile for the desktop after they switched to the native Android UI.
Edit: Starting with Firefox 33, there is a Firefox OS simulator built into Firefox (thanks to Tomek for pointing me into this direction). To start it, open WebIDE, then click "Select Runtime" and choose "Firefox OS 1.3." This will start the simulator, all you need to do then is clicking the Firefox icon (for me it's a blue one, not the usual orange). There you are, you can test any website in a real mobile browser, right on your desktop.
Firefox OS simulator can do the trick: Just install it. Run it - and run the browser inside. :)
I would like an iPhone simulator for Windows. Something similar to this one here:
http://css-tricks.com/video-screencasts/38-basics-tips-on-designing-for-the-iphone/
Note, this is NOT to test iPhone Apps... but rather, to test websites. I know I could just use a browser, but I was hoping for something with a bit more functionality ( specific to the touch interface ) that I could test some web pages on.
I've seen the beta project here: http://labs.blackbaud.com/NetCommunity/article?artid=662
Is this the best option at the moment? The article was from last year, that's why I ask.
Just to add additional information to this post:
found another one for both iphone and ipad: http://code.google.com/p/ibbdemo2/downloads/detail?name=iBBDemo2.air&can=4&q=
Google Chrome now has the ability to "Toggle Device Mode" by clicking the Phone icon in Dev Tools. This gives you a more touch-specific interface than just using the browser, allows you to throttle data, etc...
From here, you can choose the device:
You can do it all online, without a simulator:
http://iphonetester.com/
Keep in mind, it's not a real test on an iPhone, but if you use it with Safari or Chrome for Windows, you'll come really close to how it'll look on an iPhone.
UPDATE: iphonetester.com no longer exists.
That's the best I found: http://iphone4simulator.com/
There is a commercial successor to iBBDemo2 that's available for $40 - http://www.electricplum.com/studio.aspx