Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

HTML5 Canvas Scrambles on Firefox for Android

  • 1 ŋuɖoɖo
  • 7 masɔmasɔ sia le wosi
  • 5 views
  • Nuɖoɖo mlɔetɔ Kevin

more options

Good day Everybody. I hope that this is the proper channel to ask this. I am using firefox as an application platform (The application is built with PHP). A part of the application is a signature pad designed with HTML5 canvas. The pad is based on the code available here: http://www.zetakey.com/codesample-signature.php

For testing I have used an iPad with iOS 6 and Safari renders the signature pad correctly. I have tried the same on a HUAWEI mediapad 10 using firefox and the canvas itself scrambles. This is not an issue when the same is loaded on google chrome using the same tablet.

The specs of the device and firefox version are as follows: OS: Android 4.1.2 Kernel Version: 3.0.8 Firefox Version: 29.0.1

The signature pad on firefox is rendered as follows: http://i.stack.imgur.com/EGaao.jpg

The signature pad on chrome is rendered as follows: http://i.stack.imgur.com/y38Vs.jpg

While an obvious solution would be shifting to chrome, there are some elements on the design that require some features that are only available on Firefox for android since it behaves as a full fledged browser. My question is: since the code is working on chrome and on safari there are no issues with it from my point of view, is this a bug on Firefox, or am I missing something?

The code and a fiddle can be viewed here:

http://jsfiddle.net/3KHAf/

Any Thoughts?

Good day Everybody. I hope that this is the proper channel to ask this. I am using firefox as an application platform (The application is built with PHP). A part of the application is a signature pad designed with HTML5 canvas. The pad is based on the code available here: http://www.zetakey.com/codesample-signature.php For testing I have used an iPad with iOS 6 and Safari renders the signature pad correctly. I have tried the same on a HUAWEI mediapad 10 using firefox and the canvas itself scrambles. This is not an issue when the same is loaded on google chrome using the same tablet. The specs of the device and firefox version are as follows: OS: Android 4.1.2 Kernel Version: 3.0.8 Firefox Version: 29.0.1 The signature pad on firefox is rendered as follows: http://i.stack.imgur.com/EGaao.jpg The signature pad on chrome is rendered as follows: http://i.stack.imgur.com/y38Vs.jpg While an obvious solution would be shifting to chrome, there are some elements on the design that require some features that are only available on Firefox for android since it behaves as a full fledged browser. My question is: since the code is working on chrome and on safari there are no issues with it from my point of view, is this a bug on Firefox, or am I missing something? The code and a fiddle can be viewed here: http://jsfiddle.net/3KHAf/ Any Thoughts?

Mohamed Chaara trɔe

All Replies (1)

more options

Looks to be a device specific issue. The jsfiddle works fine on a Nexus S, Nexus 4, Nexus 5, Galaxy S4, and a LG Optimus Net Dual.

Filing a bug at https://bugzilla.mozilla.org/enter_bug.cgi?product=Firefox%20for%20Android&component=Graphics,%20Panning%20and%20Zooming would be good. Though I don't think we have a HUAWEI mediapad 10 in our device library.

Kevin trɔe