Blackberry Simulator OS 7 Browser distortion - html

I am testing our web app for various mobile devices. In this case, I’m running a Blackberry simulator that simulates a Blackberry Bold 9900 running Blackberry OS 7. There is nothing out of the ordinary in my pages. The first page is not particularly special, it is Html, jquery, and jquerymobile. However, the Blackberry simulator's browser shows my page like a 1970s color TV that needs its rabbit ears adjusted.
I don't have access to a real blackberry at the moment, but I've been told that our pages don't show this distortion on real hardware.
Are there any workarounds to get the simulator to better reflect that real hardware?
Is there something in my Html that is messing up the presentation on the simulator? If I don't use jquerymobile, it looks fine (for whatever that is worth).
I tried the same experiment with the jquerymobile demo site.
http://jquerymobile.com/demos/1.3.0/docs/intro/ - shows the same colorful mess as my app. See captured image below. http://forum.jquery.com/topic/jquery-mobile-demo-page-causes-blackberry-7-1-simulator-browser-to-crash has an interesting comment from a Blackberry employee:
The page does load, but not without some very major rendering
artifacts (there appears to be a colourful static/noise overlay on top
of the content.)
The simulator came from the Blackberry site.
--- Update
Blackberry device simulators can be downloaded from http://us.blackberry.com/sites/developers/resources/simulators.html
You can download simulators for a specific device and OS version. It seems that some of the simulators are buggy and don’t support jQueryMobile. However, I’ve found that the Blackberry 9790 for Blackberry OS 7 works well so far. This is 7.0.0.592 (9790).

I tracked this problem down to CSS, and more specifically the following tags:
-webkit-perspective:
-webkit-transform:
when commenting these out everything was fine.
Update: It seems like upgrading the graphics driver may solve this problem (it didn't work for me):
http://supportforums.blackberry.com/t5/Testing-and-Deployment/Blackberry-7-emulators-bug/td-p/1409051

This seems to be an error with the program itself, not your HTML. If your code works fine on the real thing but not on the simulator, then it's probably the simulator.

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

How to check a website in BlackBerry Simulator

How can I debug a Responsive site in Blackberry Q10 device, I don't have the device, but someone reported an issue with the menu in BlackBerry Q10, now I Can't debug it until I see the issue and inspect the HTML/CSS to see what is the problem.
I want to be able to view a website exact way how it will look in BlackBerry, I am on windows 7, and I have tried Chorme Emulator, Also download two simulators for BB, but it didn't work.
Please advice.
It is possible to download and install a BB10 Simulator that should run in your Win 7 environment and then you can test directly. That, in my opinion, is the best way to test.
You will need to install a VMware solution and run it as a virtual machine. But I think the documentation explains this process quite well - you will find it all here:
simulator
If you do have problems with this, then please give us something more than "it didn't work". If you look at the documentation, you will see that it should work, and it works on my Win 7 system, so I suspect there is a problem with your system or installation rather than the Simulator itself. But "it didn't work" does not give any idea where to start to help you with this.
You wont be able to inspect the HTML/CSS on the device as it is highly unlikely for you to be able to view the source. Your best option is to find out what mobile browser it is running and then try emulating it in the same resolution.
It looks like the blackberry 10.2OS default browser uses web kit so a browser that runs on the same engine should display the same things.
The Q10 resolution is 720x720 so try to emulate a web kit browser in that resolution and you'll be as close as possible without having the actual device.
If your still showing no problem, then i guess you'll have to find yourself a q10 to test it out on or ask the user with the problems with a full detail description of the problem and a picture to go with it

How do I debug Silverlight not working in Firefox/chrome/Safari?

I have a problem where a Silverlight system I have developed is working perfectly in Internet Explorer but not at all in Chrome or Firefox
I have no idea where to start to try to figure out what the problem is?
Chrome just says Cannot load Silverlight plugin which is obviously useless from a debugging point of view
Firefox just displays the container page
I have used firebug and interestingly Firefox makes no attempt to download the xap files?
This is a major issue and any pointers would be very helpful!
The application does make use of Prism which may be something to do with it
Paul

Is it possible to get translate3d working smoothly in the Android browser?

I'm working on an HTML5 interactive using phonegap and one of my pages involves using pinch-zoom functionality on an image. I've managed to get this working perfectly using the [iScroll][1] plugin but the zooming functionality is unacceptably slow. On the iPad however, everything runs incredibly smoothly.
I did read that the CSS 3 'translate3d' attribute can be used to force hardware acceleration (and this seems to be working on the iPad) but doesn't seem to have any effect on Android. From what I've read it seems that hardware acceleration isn't yet supported on Android browsers but I'm basically asking whether this is false and it is indeed possible or if there are any effective workarounds?[1]: http://cubiq.org/iscroll-4
depending of android version, see canius : http://caniuse.com/#feat=transforms3d

Are there known website compatibility issues with Galaxy Nexus phones?

I'm designing a mobile website but am having some issues with the compatibility. After testing the website on my Android phone (Rezound) and my brother's iPhone 4, the website looked okay. But when I asked a friend to test it on his Galaxy Nexus, he says he just gets a black screen.
Are there any known website compatibility issues with the Galaxy Nexus? The only thing I know about that phone is that it uses Ice Cream Sandwich, but aren't all Android o/s phones going to render the website in a similar, if not identical fashion?
This is the link to the website in question: http://m.studiosimplicit.com.
I just tested this on a Galaxy Nexus running Android 4.0.2 in the default browser, the latest Opera Mobile and Firefox, and Chrome Beta. All of the aforementioned browsers handled your site fairly well except for the default Android browser, which produced the black screen you described on first load, and the menu elements below a large black square on a subsequent load.
If I had to guess, I'd say that this has something to do with the fixed positioning of your img.bg. Support for fixed positioning was just recently introduced in Mobile Webkit, and its implementation is still a little rough around the edges. Mobile browsers that don't support position: fixed will simply ignore the styling rule and render the element with its inherited positioning while ICS' default browser, which claims to support fixed positioning, will botch the rendering of the element producing the weird behavior we're seeing.
I may be wrong, but I believe the only non-constant thing in the default Android web browser is screen resolution. Although the hardware may be different, the OS it's running and the software the OS is running are the same. It should render identically on the same OS.
The only explanation I can come up with is that Ice Cream Sandwich has flaws in its browser. Though that doesn't seem to make sense either, considering that web page is simple enough. To be honest, I'm as confused as you are right now...
I'm downloading the SDK to test your website in an emulator. Let's see what happens.
Edit: someone else seems to have taken over. I'll just leave it to him/her.