504324 - Hyper-linked MathML formulas should have default text-decoration property set to none

Status: RESOLVED FIXED

(Core :: MathML, defect)

Description

[Joe Java]

User-Agent:       Mozilla/5.0 (Macintosh; U; PPC Mac OS X 10.5; en-US; rv:1.9.1) Gecko/20090624 Firefox/3.5
Build Identifier: Mozilla/5.0 (Macintosh; U; PPC Mac OS X 10.5; en-US; rv:1.9.1) Gecko/20090624 Firefox/3.5

Hyper-linked MathML equations should not have their appearance altered (other than color changes) when linked.
     (i.e the CSS code text-decoration: none should be the default for hyper-linked MathML formulas).
    I have include and image and webpage that shows that MathML formulas
that are hyper-linked are incorrectly displayed, unless CSS "text-decoration" is set to "none"

Reproducible: Always

Steps to Reproduce:
1. go to https://eyeasme.com/Joe/MathML/MathML_text_decoration_bug
2. see the bug
3.
Actual Results:  
When a MathML formula when hyperlinked should not change its appearance
(other than color)

Expected Results:  
When a Hyper-linked MathML formula has CSS property "text-decoration" property
set to "none" it displays correctly, otherwise it does not.

 This appears to be a simple bug to fix.  Just set the default CSS for hyper-linked MathML equations to "text-decoration: none"

Comment 1

[Joe Java]

Attachment: here is an image of the problem

Attached is an image that clearly shows the problem.  MathML formulas should not change their (non-color) appearance when hyper-linked.

Comment 2

[Frédéric Wang (:fredw)]

Attachment: Testcase

Comment 3

[Frédéric Wang (:fredw)]

Attachment: Screenshot of the testcase (Firefox)

Comment 4

[Frédéric Wang (:fredw)]

Attachment: Screenshot of the testcase (Amaya)

Comment 5

[Frédéric Wang (:fredw)]

Just setting text-decoration: none on the <math/> element does not seem to work. 

Note the behavior of Amaya: "text-decoration: underline" is also inherited, but the workaround "text-decoration: none" works. Also, note that using xlink avoids this problem since no CSS is added (but XLink is currently broken, see bug 427990).

Comment 6

[Joe Java]

In regards to Comments 2 - 5.

I have modified your example to more clearly show how the CSS property 
'text-decoration' changes the appearence of hyperlinked equations.
 
https://eyeasme.com/Joe/MathML/test_for_bug504324.html

I have attached an image of the page.

Comment 7

[Joe Java]

Attachment: image of webpage https://eyeasme.com/Joe/MathML/test_for_bug504324.html

image of page
https://eyeasme.com/Joe/MathML/test_for_bug504324.html

using firefox 3.5.3 on OS X 10.5.8

Comment 8

[Frédéric Wang (:fredw)]

Attachment: <a/> with text + MathML inside

I don't think setting text-decoration to false at the <a/> level is an appropriate fix because <math/> may have siblings that should be underlined. Setting text-decoration to false at the <math/> level would be OK (even if I think it's better to underline the whole formula) but it just seems not to work.

Comment 9

[Joe Java]

MathML equations that are hyperlinked should not have their "size" changed or be underlined (since an equation might use underlining as a symbolic representation of a mathematical concept).  Color changes to represent hyperlinking would be OK, since CSS allows for the control of hyperlinking colors.

Comment 10

[Frédéric Wang (:fredw)]

(In reply to comment #9)
> MathML equations that are hyperlinked should not have their "size" changed or
> be underlined (since an equation might use underlining as a symbolic
> representation of a mathematical concept).  Color changes to represent
> hyperlinking would be OK, since CSS allows for the control of hyperlinking
> colors.

I don't think underlining a formula is really problematic and actually I find it more consistent with the surrounding HTML. In attachment 407786 [details], I would find strange to have the beginning of the link "the formula" and the end "inside a <a/>" underlined but not the formula "sqrt(x^2 - 1)".

Anyway, my point was that the fix you suggest (setting text-decoration:false to the <a/>) is bad, because the <math/> element changes the style of its parent element. What could be OK is setting text-decoration:false to the <math/> element, but this does not work.

I think the right thing to do is to find why there are additional spaces when the formula is in a link. text-decoration on the parent <a/> probably change other rendering parameters and I would be interested to know what is exactly happening.

Comment 11

[Joe Java]

(In reply to comment #10)
> (In reply to comment #9)
> > MathML equations that are hyperlinked should not have their "size" changed or
> > be underlined (since an equation might use underlining as a symbolic
> > representation of a mathematical concept).  Color changes to represent
> > hyperlinking would be OK, since CSS allows for the control of hyperlinking
> > colors.
> 
> I don't think underlining a formula is really problematic and actually I find
> it more consistent with the surrounding HTML. In attachment 407786 [details], I would
> find strange to have the beginning of the link "the formula" and the end
> "inside a <a/>" underlined but not the formula "sqrt(x^2 - 1)".
> 

sigh.... OK... Underlining is an acceptable mathematical symbol.
See 
https://eyeasme.com/Joe/MathML/MathML_browser_test
The "De Morgan's law" example.  There overlining represents complementation.  In the same way often underlining can be used to represent a attribute.

For example, what is the value of "sin(1.4)"  The answer depends on if the angle is in radians or degrees, sometimes to make life easier all degree angles are underlined.

In teaching linear algebra sometimes it helps the student to underline variables that are one dimensional, underline twice two dimensional variables and not underlining scalars.

If lecture notes are htmlized and variables are hyperlinked, then when a student prints out the htmlized lecture notes everything will be screwed up by the added underlining done by the browser.  

MathML equations/formulas should not be changed in shape or have additional markings made to them by being hyperlinked.  They should not be bolded, underlined, overlined, dashed, etc., when hyperlinked  They CAN have their color change and the cursor can change shape when over the equation.

I understand your desire be uniform with the surrounding HTML, but MathML is NOT HTML.  Mathematical equations are in a class all there own... like images, SVG, applets, etc.  


> Anyway, my point was that the fix you suggest (setting text-decoration:false to
> the <a/>) is bad, because the <math/> element changes the style of its parent
> element. What could be OK is setting text-decoration:false to the <math/>
> element, but this does not work.
> 
> I think the right thing to do is to find why there are additional spaces when
> the formula is in a link. text-decoration on the parent <a/> probably change
> other rendering parameters and I would be interested to know what is exactly
> happening.

I agree that my fix is not correct for all cases.  I would like the final solution to end up producing hyperlinked equations that look similar the third example in
https://eyeasme.com/Joe/MathML/test_for_bug504324.html
There the MathML equation is marked as hyperlinked by having ONLY its color changed (and the mouse changes shape over it to show a hyperlink).

Comment 12

[Frédéric Wang (:fredw)]

Attachment: testcase

updated testcase

Comment 13

[Frédéric Wang (:fredw)]

Attachment: Patch for xlink and mathml 3 href

This patch fixes the cases 2 and 3 (xlink and MathML 3 href).

Comment 14

[Robert O'Callahan (:roc) (email my personal email if necessary)]

Two things:
* wouldn't it be better to use :link instead of attribute selectors?
* why !important? shouldn't authors be able to override this?

Comment 15

[Robert O'Callahan (:roc) (email my personal email if necessary)]

So I think you just want

:-moz-any-link { text-decoration:none; }

Comment 16

[Robert O'Callahan (:roc) (email my personal email if necessary)]

If that works! I'm not sure how the precedence will work out between mathml.css and the rules inserted by PresShell::SetPrefLinkRules.

Comment 17

[Robert O'Callahan (:roc) (email my personal email if necessary)]

If that doesn't work you might need to insert a MathML rule into PresShell::SetPrefLinkRules (or just make the mathml.css rule !important).

Comment 18

[Frédéric Wang (:fredw)]

Thanks for the hints. Yes, the patch uses !important because it doesn't work otherwise. I can also use :-moz-any-link { text-decoration:none; !important; }, which gives the same result.

To extend slightly the issue of this bug, note that the rule "text-decoration: underline;" confuses the rendering of formulas (it adds unexpected spaces under each MathML frames). Moreover, I think the appropriate markup for underlying a MathML fragment is rather <menclose notation="bottom"> ... </menclose> instead of CSS text-decoration. Hence I guess we could actually set text-decoration=none for any MathML element?

However, putting "text-decoration: none !important;" in mathml.css does not work for the top-level <math/> element (see tests 1 and 2 of attachment 502338 [details]). Is there a simple way to make this work?

Comment 19

[Robert O'Callahan (:roc) (email my personal email if necessary)]

I don't know why that wouldn't work.

Comment 20

[Frédéric Wang (:fredw)]

Attachment: Patch for xlink and mathml 3 href (V2)

Comment 21

[Joe Java]

Concerning underlining hyper-linked MathML: see

http://lists.w3.org/Archives/Public/www-style/2010Aug/0334.html

specifically:

  | User agents must not render these text decorations on content that is
  | not text. For example, images and inline blocks must not be underlined.

if MathML is considered "not text" then it should not be underlined.

Comment 22

[Bill Gianopoulos [:WG9s]]

(In reply to comment #21)
> Concerning underlining hyper-linked MathML: see
> 
> http://lists.w3.org/Archives/Public/www-style/2010Aug/0334.html
> 
> specifically:
> 
>   | User agents must not render these text decorations on content that is
>   | not text. For example, images and inline blocks must not be underlined.
> 
> if MathML is considered "not text" then it should not be underlined.

MathML is actually a special case in that links can really never be underlined, as doing so alters the formulas by making it look like you are doing division where you are not.

Comment 23

[Henri Sivonen (:hsivonen)]

Pushed to inbound along with bug 427990:
http://hg.mozilla.org/integration/mozilla-inbound/rev/6b26a5b08522

Comment 24

[Marco Bonardo [:mak]]

http://hg.mozilla.org/mozilla-central/rev/6b26a5b08522

Comment 25

[Frédéric Wang (:fredw)]

The patch doesn't fix the bug when the link is done that way: <a href=""><math>...</math></a>. However, it does fix cases such as <math href="">...</math>, <math>...<mrow href="">...</mrow>  ...</math> (and similarly for xlink:href) which are the appropriate way to do links in MathML.

Comment 26

[Joe Java]

I have updated the reference page to HTML5
https://eyeasme.com/Joe/MathML/MathML_text_decoration_bug

The problem is that I place the MathML code into my HTML5 
pages with PHP includes.  MathML is very verbose, it is easier
to work with several smaller files automatically included into
one large file, rather than one huge file.  It is easy to create
the MathML code and them just use the PHP include command to 
embed the code within any link tag 'a'.

As noted in Comment #25 and shown in the reference page this 
does not work.

Should a new bug be filed for the case of a math tag within
link tab or this bug re-opened?

Comment 27

[Joe Java]

Also note that once a linked MathML formula has been visited 
the blue "never been visited" and purple "visited" link colors 
get screwed up and only part of the formula has the purple 
"been visited" color.  

Should this be a new bug or a continuation of this bug?

Comment 28

[Frédéric Wang (:fredw)]

> Should a new bug be filed for the case of a math tag within
> link tab or this bug re-opened?

Please open a separate bug for that. Also, note that it is not specific to links, for example it also happens with <u> (see attachment 502338 [details]).

Comment 29

[Frédéric Wang (:fredw)]

(In reply to comment #27)
> Also note that once a linked MathML formula has been visited 
> the blue "never been visited" and purple "visited" link colors 
> get screwed up and only part of the formula has the purple 
> "been visited" color.  
> 
> Should this be a new bug or a continuation of this bug?

A new bug, please. I think it only happens with <mo>'s, which are drawn differently because of there stretchiness property.