854218 - [E-Mail] Display/CSS: Add support for/stop sanitizing media queries

Status: RESOLVED WONTFIX

(Firefox OS Graveyard :: Gaia::E-Mail, defect)

Description

[Remi]

User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_5) AppleWebKit/537.22 (KHTML, like Gecko) Chrome/25.0.1364.172 Safari/537.22

Steps to reproduce:

I tested some responsive email layouts on Firefox OS. I used this test email : http://hteumeuleu.fr/wp-content/uploads/2013/03/fxos-email.html 
It's a very typical code for a responsive email : one main table, two floating table inside. When being displayed on a smaller screen, styles inside a media query resizes the main table. This email was tested on iOS and Android default mail applications and work as intended. 


Actual results:

The styles inside the media query are never applied. I've tried using a different syntax for the query (like "screen and (max-width:480px), but it didn't work. I've tried an "always true" query (like "min-width:1px"), but it didn't work.


Expected results:

Styles within a media query should be applied when possible.

Comment 1

[Karl Dubost💡 :karlcow]

I have the feeling that the CSS sanitization rules are a bit too strict on this one. 

Andrew, where is the code for the Sanitizer in the email application?
Maybe someone will want to create a patch?

Comment 2

[Karl Dubost💡 :karlcow]

Found https://wiki.mozilla.org/Gaia/Email
which points to

* Back end https://github.com/mozilla-b2g/gaia-email-libs-and-more
* Front end https://github.com/mozilla-b2g/gaia/tree/master/apps/email

Found more specifically in htmlchew.js the legal list of CSS properties:
https://github.com/mozilla-b2g/gaia/blob/8d965e7182500fd1849e8eec5ae2aca35a55af22/apps/email/js/ext/htmlchew.js#L330

That should be a good start.

Comment 3

[Andrew Sutherland [:asuth] (he/him)]

Note that the actual sanitizer is https://github.com/mozilla-b2g/bleach.js and it has unit tests that make that a better/easier place to hack on things.  One would then propagate the white-list settings back to htmlchew.js in gaia-email-libs-and-more.

Comment 4

[BMO Automation]

Firefox OS is not being worked on