878509 - Restore the HTMLImageElement.lowsrc, x, y attributes that were unintentionally removed

Status: RESOLVED FIXED

(Core :: DOM: Core & HTML, defect)

Description

[rhsdesign]

User Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:21.0) Gecko/20100101 Firefox/21.0 (Beta/Release)
Build ID: 20130511120803

Steps to reproduce:

I upgraded Firefox browser to latest version 21.0.


Actual results:

All web sites created with DHTML rollover swap image effect now display a broken image.


Expected results:

Mouse overs should produce a different linked image. The DHTML effect still visible in IE10 and other browsers

Comment 1

[Mardeg]

Do you have an example link where it isn't working?

Comment 2

[Mardeg]

Attachment: Ancient animate.js script for testcase

Attached is a copy of the javascript file with the following error when the page loads:
Error: TypeError: doc_els is undefined
Line: 105

Comment 3

[Mardeg]

bug 864367 mentions this started in Firefox 20. Changing product to match that one.

Comment 4

[Mardeg]

Attachment: Image before mouseover for testcase

Comment 5

[Mardeg]

Attachment: Image during mouseover for testcase

Comment 6

[Kohei Yoshino]

The deprecated lowsrc attribute has been dropped by Bug 825527. Same as Bug 864367.

Comment 7

[Mardeg]

Attachment: Reduced Testcase

Comment 8

[Mardeg]

Attachment: Minimal fix to make testcase work

Confirming that the image rollover code works by changing:

document['fpAnimswapImgFP6'].src=document['fpAnimswapImgFP6'].lowsrc

to

document['fpAnimswapImgFP6'].src=document['fpAnimswapImgFP6'].getAttribute('lowsrc');

Bob, let us know when you've updated all the code on your sites replacing every instance of .lowsrc with .getAttribute('lowsrc')

Please visit https://bugzilla.mozilla.org/show_bug.cgi?id=878509#c8 and reply there instead of directly to my email address.

Comment 10

[:Ms2ger (he/him; ⌚ UTC+1/+2)]

Attachment: Patch v1

Comment 11

[Boris Zbarsky [:bzbarsky]]

Wait.  If sites depend on these, don't we need a spec bug to have them in the spec?

Comment 12

[:Ms2ger (he/him; ⌚ UTC+1/+2)]

And since you're around and smaug doesn't seem to be, feel free to r+ :)

Comment 13

[Olli Pettay [:smaug][[e-mail]]]

Comment on attachment 757086 [details] [diff] [review]
Patch v1

A test would be nice.

Comment 14

[rhsdesign]

Hi Everyone,

First let me say thank you for the attention and the workaround. I really would have hated to go to another browser as I have been using Firefox quite awhile now and really like it.  Absolutely dislike all other browsers. IE10 destroys the drop menu graphics and button character used in my shopping carts! I'm impressed with your community of code debuggers and your jump to fix attitude. Thank you.

FrontPage 2000 uses shared borders and the code search and replace had to be done in the separate border HTML file, it does not show in the main page HTML view on all but one site listed. These (below) are the web sites I manage which have the DHTML rollovers I created using the code found within FP2000 itself and your fix was right on target...

http://www.wps.org/

http://www.catskillmtncrystal.com/

http://www.stonerivergear.com/

http://www.stonerivergearpromos.com/

http://www.stonerivertradingcompany.com/

http://www.stormphotoinc.com/

I realize FP 2000 is an EOL product, but when you have websites with huge shopping carts designed in that environment and clients who are unwilling to pay me to change the interface because of outdated software, one has a major problem! I'm stuck using the software until the client decides otherwise. Like I said earlier about the software, I'm the master of it and it's not the master of me, thankfully!

Not to sound ungrateful, but this fix is on my side and if I read correctly in the bug fix CC's the error is in Firefox's domain. I would like to be using the software as is and not having to do a search and replace each time I decide to use a rollover. Is that possible?

Thanks again for your help. My clients also thank you I'm sure!

Bob Sickler

Comment 15

[:Ms2ger (he/him; ⌚ UTC+1/+2)]

Landed the fix:

https://hg.mozilla.org/integration/mozilla-inbound/rev/2d5a92daf4f1

Working on a test now

Comment 16

[:Ms2ger (he/him; ⌚ UTC+1/+2)]

Comment on attachment 757086 [details] [diff] [review]
Patch v1

[Approval Request Comment]
Bug caused by (feature/regressing bug #): bug 825527
User impact if declined: broken sites (and quite a few, it seems)
Testing completed (on m-c, etc.): on inbound
Risk to taking this patch (and alternatives if risky): low risk
String or IDL/UUID changes made by this patch: none

Comment 17

[Mardeg]

Attachment: Example of http://www.wps.org/ homepage using CSS

(In reply to rhsdesign from comment #14)
> this fix is on my side and if I read correctly
> in the bug fix CC's the error is in Firefox's domain.
It looks like support for the original .lowsrc will land in Firefox 22 onwards, although...
> I would like to be
> using the software as is and not having to do a search and replace each time
> I decide to use a rollover. Is that possible?
Continuing to create new webpages with such deprecated code in them is guaranteed to bite you like this more and more frequently into the future.

You will greatly benefit from switching your clients to a free modern webpage editor like the one at http://bluegriffon.org that will allow you to do rollovers *without the need for javascript*, using Cascading Style Sheets (CSS) which you'll need time to learn of course. The Firefox developers just gave you that time, please use it wisely.

I've attached a homepage example of the first site you linked to that has the following CSS :hover code on those links without needing images for them:
    <style type="text/css">
.topbar {  
  color: #031e61;  
  text-decoration: none;  
  font-family: Impact, sans-serif;  
  font-size: 15px;  
  letter-spacing: 0.8px;  
  padding-left: 0.8px;
}

.topbar:hover {  
  color: #fef9ff;  
  background-color: #031e61;
}
    </style>

To change the rollover colour in Bluegriffon, copy the attachment link from this bug page into File -> Open, then click to place the caret on any one of the links, then do Panels -> Style Properties, in that dialog from the "Apply styles to" dropdown choose "All elements of class.." and pick "topbar" from the adjacent dropdown. Clicking the dot next to "Foreground" and "Background" brings up a colour picker and after picking one and clicking "OK" in that dialog you can immediately mouseover the links to see the new :hover colours.
To get the equivalent of FP "border" files you can save styles to an external .css file so other webpages can use it. More at http://en.flossmanuals.net/bluegriffon/using-external-cascading-style-sheets-to-control-the-appearance-of-a-set-of-pages/
> Thanks again for your help. My clients also thank you I'm sure!
> 
> Bob Sickler
You're welcome! Please don't mistake my long post as anything but enthusiasm to see you update your web authoring skills, sorry about the length. Also apologies to the devs patching Firefox for having to scroll past this as the wrong place for a tutorial!

Comment 18

[Mardeg]

Oops, I forgot the most important step(In reply to Mardeg from comment #17)
> then do Panels -> Style Properties, in that dialog from the
> "Apply styles to" dropdown choose "All elements of class.." and pick
> "topbar" from the adjacent dropdown.
You need to tick the box (below those dropdowns) for "when the pointer hovers over the element" to choose rollover colours!

Comment 19

[Phil Ringnalda (:philor)]

https://hg.mozilla.org/mozilla-central/rev/2d5a92daf4f1

Comment 20

[:Ms2ger (he/him; ⌚ UTC+1/+2)]

I'm looking at writing a test as well.

Comment 21

[Alex Keybl [:akeybl]]

Comment on attachment 757086 [details] [diff] [review]
Patch v1

Low risk fix for recent regression with web regressions that will make it into b4. Approving.

Comment 22

[:Ms2ger (he/him; ⌚ UTC+1/+2)]

(In reply to :Ms2ger from comment #20)
> I'm looking at writing a test as well.

Over in bug 878950.

Comment 23

[rhsdesign]

Hi Folks.. Bug Finder here... If you implement a patch fix, how will that affect the change in code I made to my web sites to make it work currently? Bob Sickler

Comment 24

[Boris Zbarsky [:bzbarsky]]

In the patched builds, both the old code (.lowsrc) and the new code (.getAttibute("lowsrc")) will work.

Comment 25

[Ryan VanderMeulen [:RyanVM]]

https://hg.mozilla.org/releases/mozilla-aurora/rev/beaa70e61024

Comment 26

[Ryan VanderMeulen [:RyanVM]]

This needs ba+ due to it touching a .webidl file.

Comment 27

[Boris Zbarsky [:bzbarsky]]

What's ba+?

Comment 28

[Boris Zbarsky [:bzbarsky]]

Oh, "binary approval"?

webidl is not xpidl.  It's JS-only; changing it does not affect binary anything.

Comment 29

[Andrew McCreight [:mccr8]]

I filed bug 879086 for fixing the commit hook.

Comment 30

[Ryan VanderMeulen [:RyanVM]]

https://hg.mozilla.org/releases/mozilla-beta/rev/2c09308b4015

Comment 31

[Manuela Muntean [Away]]

Verified fixed with Firefox 22 beta 4 (build ID: 20130605070403), using the testcase from comment 7 and the link:  http://www.catskillmtncrystal.com/, on both Ubuntu 12.10 32bit and Mac OSX 10.8.3