Closed Bug 504324 Opened 15 years ago Closed 13 years ago

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

Categories

(Core :: MathML, defect)

defect
Not set
normal

Tracking

()

RESOLVED FIXED
mozilla7

People

(Reporter: cop3252, Assigned: fredw)

References

()

Details

(Whiteboard: [inbound])

Attachments

(4 files, 5 obsolete files)

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"
Attached is an image that clearly shows the problem.  MathML formulas should not change their (non-color) appearance when hyper-linked.
Status: UNCONFIRMED → NEW
Component: General → MathML
Ever confirmed: true
Product: Firefox → Core
QA Contact: general → mathml
Attached file Testcase (obsolete) —
Attached image Screenshot of the testcase (Firefox) (obsolete) —
Attached image Screenshot of the testcase (Amaya) (obsolete) —
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).
OS: Mac OS X → All
Hardware: PowerPC → All
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.
Attached file <a/> with text + MathML inside (obsolete) —
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.
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.
(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.
(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).
Attached file testcase
updated testcase
Attachment #407731 - Attachment is obsolete: true
Attachment #407732 - Attachment is obsolete: true
Attachment #407733 - Attachment is obsolete: true
Attachment #407786 - Attachment is obsolete: true
This patch fixes the cases 2 and 3 (xlink and MathML 3 href).
Attachment #502339 - Flags: review?(roc)
Two things:
* wouldn't it be better to use :link instead of attribute selectors?
* why !important? shouldn't authors be able to override this?
So I think you just want

:-moz-any-link { text-decoration:none; }
If that works! I'm not sure how the precedence will work out between mathml.css and the rules inserted by PresShell::SetPrefLinkRules.
If that doesn't work you might need to insert a MathML rule into PresShell::SetPrefLinkRules (or just make the mathml.css rule !important).
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?
I don't know why that wouldn't work.
Attachment #502339 - Attachment is obsolete: true
Attachment #502339 - Flags: review?(roc)
Attachment #505534 - Flags: review?(roc)
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.
(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.
Pushed to inbound along with bug 427990:
http://hg.mozilla.org/integration/mozilla-inbound/rev/6b26a5b08522
Whiteboard: [inbound]
Target Milestone: --- → mozilla7
http://hg.mozilla.org/mozilla-central/rev/6b26a5b08522
Status: NEW → RESOLVED
Closed: 13 years ago
Resolution: --- → FIXED
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.
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?
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?
> 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]).
(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.
Assignee: nobody → fred.wang
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: