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.
Related
In developing our passkey integration I'm encountering unusual behavior in Chrome on Windows.
On my PC, when I register a new physical key I see this Windows dialog.
When I enable the virtual authenticator environment in the Chrome Dev Tools I get this Chrome dialog instead.
However, someone testing the application for me on another PC, without using the virtual authenticator environment, gets the Windows dialog first. If they click Cancel in the Windows dialog, then they get the Chrome dialog.
Is there anything I can do to nudge the browser towards delivering a more consistent experience? I'd rather always show the Chrome dialog if possible.
For reference, this is the virtual authenticator environment in the Chrome Dev Tools:
The problem is that lots of enterprise users have to use a physical security key one or more times a day. So there's a strong desire not to put extra clicks in their way and thus to jump directly to the Windows system UI. But the Windows UI doesn't support using phones as authenticators, so sometimes the browser UI is needed as hitting escape is quite non-discoverable.
Quite how that balance is struck has varied over time and might change again in the future. You can see the current logic here if you want to craft requests that trigger the browser UI. But the intent is that sites should do the obvious thing and the UI should be fairly reasonable.
What is a good way to test a Webforms website with a mobile master page from code? Electric Mobile Studio works but it is not free.
I use Chrome DevTools (Ctrl+Shift+I).
From DevTools you can toggle device tool bar (Ctrl+Shift+M).
Once open you can view as different:
devices
resolutions
network speeds
and change from portrait to landscape.
This is the best solution I have been able to find in the past year+
Chrome has an extension called "User-Agent Switcher for Chrome." It can be used to switch to iPad and other views that will invoke the mobile master page.
The main strength of this solution (for me) is that it can be used from code in debug mode.
https://chrome.google.com/webstore/detail/user-agent-switcher-for-c/djflhoibgkdhkhhcedjiklpkjnoahfmg
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.
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 need to see the output by mobile joomla plugin in my regular browser, to be able to style and tweak things easily.
In older versions of mobile joomla ther was an option ('Mobile Always') that would output mobile views all the time. But I can't find it current version (1.0.3)
You can always install User Agent Switcher for Firefox. It gives you the ability to change to a mobile user agent and also a few others things such as IE6 and IE7. You can also add others. Hope this helps. Regards.