Ionic 4 Selects Not Working in Firefox Responsive Design Mode - ionic-framework

I have recently started working with the Ionic framework, and have encountered a very strange error regarding the ion-select element. Upon being clicked by the user, it generates no Ionic alert. I originally thought it was an error in my own code, however found nothing, and upon accidentally exiting Mozilla Firefox's Responsive Design Mode, it worked perfectly. I then tried this sample code from the Ionic documentation on how to use ion-select. This code uses the Ionic components without any framework. In Responsive Design Mode, it fails to generate any alerts when the selects are clicked, and no errors are produced. I'm using Firefox 71.0 (64-bit) on Ubuntu 18.04.
The selects function perfectly without Responsive Design Mode, and while shrinking the browser window. In Responsive Design Mode, they do function properly when simulating large devices, such as a TV, but not with anything else. I thought this might be an error in the user agent, so here is a user agent for when it doesn't work (TVs and Laptops have no user agent, they are just different sizes):
Galaxy S9/S9+: Mozilla/5.0 (Linux; Android 7.0; SM-G892A Build/NRD90M; wv) AppleWebKit/537.36 (KHTML, like Gecko) Version/4.0 Chrome/67.0.3396.87 Mobile Safari/537.36
UPDATE: I did some further testing and the other thing that fixes the problem is removing the ion-select from its ion-item container. I have no idea why this would fix the problem, which changes my original idea that this could be to do with the user agent. Also, I tried manually changing my browser's user agent to the above, and the selects work perfectly. This appears to be an issue with Responsive Design Mode?
Any help would be appreciated!

Okay. I figured it out after a lot more testing. This appears to be some strange thing in the touch simulation of Responsive Design Mode. I accidentally disabled it (really should've tried that sooner), and the problem was gone. I have no idea what causes this odd behaviour and an explanation would still be appreciated, but the fix is quite easy.

Related

Ionic App behaving differently across browsers and devices

I am building an Ionic App and i have been testing the app on Google Chrome Canary and it was working perfectly fine as expected. Recently, i tried testing the app on Mozilla Firefox and the app was behaving a bit weird like some buttons weren't working and the app was getting stucked. I ignored it considering that it might be an issue with Mozilla Firefox. Today, i installed the app on my device and to my surprise the app is behaving the same as it was behaving in Firefox. Some buttons aren't working and also the app is getting stucked. I need to release the app for production, as early as possible and i am stucked with this weird issue.
Please help me out.
P.S. - I have also added the crosswalk plugin.

Why is the positioning of certain elements way off in Chrome for Windows?

I just looked at my website on Chrome for Windows, and my website looks horrible, things are definitely out of position. On Chrome/Safari for Mac, everything looks perfect. I don't think it is a resolution issue, because I went to the devices tab in chrome dev, and change to all sorts of different dimension sizes (including the one for my macbook), and no matter what I change it to, the positioning of certain elements is completely off. Is this a Windows thing? I thought browsers were OS agnostic?

How to detect if mobile version on WEB game

I have a game based on libgdx that's hosted online.
It runs great on desktop but on mubile it depends on the phone's size.
The game is usually a bit too big and it's quite some trouble to try to make it fit the whole screen.
I have an option to put the game fullscreen, but I'd like for the game to automatically be fullscreen IF it's online AND on a mobile device.
However I haven't found anything to help me with that in libgdx's library, any ideas?
(edit, added code, I didn't show code in the first place because the solution may be in doin php redirection if there's nothing better... then I'd have 2 version of the code, one for desktop and the other one would automatically be fullscreen, for mobile... but having all the source code twice just for an "if" looks overkill to me...)
Here's how I can see wether the game runs on a web page, android or desktop :
(Gdx.app.getType() == ApplicationType.WebGL)
But more then knowing that it's on WebGL, I want to know if the web page ran from a cell phone or tablet or from a desktop.
thanks

Intel XDK build for Android not working

I am very new to Intel XDK.
To build my initial concepts, I made a very simple html 5 hello world page and it is working fine when running under EMULATE tab.
I build the app for Android, email to my address, download on mobile and installed it as well.
But after installation, when I start the application, it shows the first page with title "Html5 App Development" and then a blank White screen, that's it, I am not able to view my index.html page on the mobile.
What am I doing wrong here?
I hope that by now you have solved the problem but in case other people run into this thread. We had the same issue at times with our app until we tracked down the problem to the way the init and document ready gets fired.
Tweaking with the document ready features did the trick for us.
It sounds like you probably have it drawn at some point offscreen, due to the pixels rendered in the display vs actual pixels.
Try setting the viewport/screen size to handle this: https://gamedev.stackexchange.com/questions/70700/viewport-pixels-trouble-intel-xdk

iPhone Browser Live Testing

I'm using win7.
and i have website which i want to test it with iPhone browser environment.
which it's use most flash (jISFR).
this is the website i talking for,
http://www.hamuranalodge.com/
may you can see menu navigation is using flash jSIFR, which it's seems not work in iPhone, and want to fix it. of course i need iphone Testing for it.
Is there somebody know how i can test it with iphone browser?
may there is a software can do it?
or a website give service like that?
Thanks
Not a perfect solution but you might be able to test it on the Android browser instead. The SDK runs on all major OSs and is free to download and install. Just make sure that flash support is turned off. I'm pretty sure iPhone and Android both use WebKit so you should get similar behaviour on both.
You could use the iPhone simulator if you have access to a Mac.
There are sites like this:
http://www.testiphone.com/
but this one doesn't work very well, at least not for this particular request. Go there and point it at www.worldsbk.com - it renders the Flash block on the top right hand side just fine on my desktop computer (Firefox3 Mac OS X), but have a look here:
http://www.flickr.com/photos/bigiain/5037577763/
to see a screen grab of that page from my iPhone... Note the big grey block where the flash bit should be...