Bug Tracker

Ticket #3116 (closed bug: fixed)

Opened 6 years ago

Last modified 3 years ago

.attr does not work with SVG IDLs

Reported by: atrax Owned by: timmywil
Priority: high Milestone: 1.6
Component: attributes Version: 1.5.2
Keywords: .attr SVG read-only Cc:
Blocking: #7584 Blocked by:

Description

The function .attr does not work with read only interfaces of SVG specification. If you try to set a attribute that is present in a SVG IDL you get an error about setting a property for which only a getter is defined.

In previous versions of JQuery the DOM IDL setAttribute would have been used to set cx for circle. In JQuery 1.2.6 circle[cx] is used which maps to the SVG IDL: read only property.

A simple example:

<!DOCTYPE html PUBLIC "-W3CDTD XHTML 1.1 plus MathML 2.0 plus VG 1.1EN" " http://www.w3.org/2002/04/xhtml-math-svg/xhtml-math-svg.dtd">

<html xmlns=" http://www.w3.org/1999/xhtml">

<head>

<script src="jquery-1.2.6.js" />

<script type="text/javascript">

function test()

{

$('circle').attr("cx", "1");

}

</script> <title>

Demo

</title>

</head>

<body onload = "test();">

<svg xmlns=" http://www.w3.org/2000/svg" xmlns:xlink="http://

www.w3.org/1999/xlink" version="1.1" baseProfile="full" width="3000" height="3000">

<circle cx="200px" cy="200px" r="150px" />

</svg>

</body>

</html>

Attachments

attr[5790].diff Download (472 bytes) - added by flesler 6 years ago.

Change History

comment:1 Changed 6 years ago by flesler

Do you actually get an error ? or attr() simply does nothing ?

comment:2 Changed 6 years ago by atrax

Firefox does nothing visible for the user but on the error console it shows an error that I tried to set a property for which only a getter is defined.

Error: setting a property that has only a getter Source file:  http://fsmat.at/~atrax/jquery-1.2.6.js Zeile: 1070

You can see my little example online:  http://fsmat.at/~atrax/JQuery-Test.xhtml

comment:3 Changed 6 years ago by flesler

  • Owner set to flesler
  • Status changed from new to assigned

Ok, I think we need to treat SVG nodes as xml elements... this could just mean extending $.isXmlDoc a bit.

comment:4 follow-up: ↓ 5 Changed 6 years ago by flesler

  • need changed from Review to Patch

I can't really reproduce this as I don't know how to use svg. I tried this on FF 3 but no luck.

Can you please apply the following patch to your jQuery version and see if that solves it ? Then, let me know.

Cheers

Changed 6 years ago by flesler

comment:5 in reply to: ↑ 4 Changed 6 years ago by atrax

I tried your patch but it won't work this way. The problem is that you only check for 'svg' element (where nodeName is svg). The problem, however, persists for elements that are defined in svg (like 'circle' in my example).

If you look at my example there is only one line of svg code; a circle. circle is a tagname defined in svg and therefore has the abovementioned behaviour that its defined attributes are not set-able via the svg interface (elem[attrname] = value, compare jquery line 1070); you have to use the standard DOM interface (elem.setAttribute (attrname, value), compare jquery line 1085).

Please have a look at  SVG-specs and search for 'SVGCircleElement'. There you will find the source of the problem (as far as I understand it):

interface SVGCircleElement : 
                SVGElement,
                SVGTests,
                SVGLangSpace,
                SVGExternalResourcesRequired,
                SVGStylable,
                SVGTransformable,
                events::EventTarget { 
    readonly attribute SVGAnimatedLength cx;
    readonly attribute SVGAnimatedLength cy;
    readonly attribute SVGAnimatedLength r;
  };

I hope that you will find a solution. I will keep looking for one too :-)

regards

Replying to flesler:

I can't really reproduce this as I don't know how to use svg. I tried this on FF 3 but no luck.

Can you please apply the following patch to your jQuery version and see if that solves it ? Then, let me know.

Cheers

comment:6 Changed 4 years ago by snover

#5706 is a duplicate of this ticket.

comment:7 Changed 4 years ago by snover

#6884 is a duplicate of this ticket.

comment:8 Changed 4 years ago by snover

  • Blocking 7584 added

comment:9 Changed 4 years ago by jitter

  • Owner flesler deleted
  • Priority changed from major to high
  • Version changed from 1.2.6 to git
  • Status changed from assigned to open
  • Milestone changed from 1.3 to 1.next

comment:10 Changed 4 years ago by mpedrotti

I have been setting attributes successfully, so invested some time to reproduce this bug report.

Open an .xhtml file (which corresponds to the fiddle link below based on the code in the description above) with uncompressed jQuery versions in Firefox 3.6.14, Opera 11.01, Safari 5.0.3, and Internet Explorer 9.8080.16413 (RC).
The bug occurs in jQuery 1.2.5, 1.2.6 (specific version cited for this ticket), and 1.3.
The bug does not occur in jQuery 1.2.4 or any release from 1.3.1 through 1.5.1 (although IE9RC throws an exception in jQuery 1.4 through 1.5 before it calls the attr method because of #8052; in 1.3.1 and 1.3.2, it calls the attr method successfully before it throws the exception).

Here are a few details to help a team member confirm that this ticket can be closed:

1.2.4 attr:

// Certain attributes only work when accessed via the old DOM 0 way
if ( fix[ name ] ) {

This does not apply to SVG elements.

// IE elem.getAttribute passes even for style
else if ( elem.tagName ) {

Calls to getAttribute and setAttribute succeed.

1.2.5 attr:

// If applicable, access the attribute via the DOM 0 way
if ( notxml && !special && name in elem ) {

Value of notxml is incorrect for SVG in XHTML5.
It had also been incorrect in 1.2.4 but now it makes a difference.
The following assignment throws an exception:

elem[ name ] = value;

1.3.1 attr:

// If applicable, access the attribute via the DOM 0 way
if ( name in elem && notxml && !special ) {

Value of notxml is correct because of change to isXMLDoc.
This does not apply to SVG in XHTML5 any more.
The following calls to getAttribute and setAttribute succeed.

if ( set )
// convert the value to a string (all browsers do this but IE) see #1070
elem.setAttribute( name, "" + value );
var attr = !jQuery.support.hrefNormalized && notxml && special
// Some attributes require a special call on IE
? elem.getAttribute( name, 2 )
: elem.getAttribute( name );

Here is a jsFiddle, but sadly it doesn't directly show the meat of the issue because the file is HTML5 instead of XHTML5 (that is, served as XML in addition to having the HTML5 DOCTYPE).

 http://jsfiddle.net/mpedrotti/eaVLG/

Last edited 4 years ago by mpedrotti (previous) (diff)

comment:11 Changed 4 years ago by addyosmani

  • Status changed from open to closed
  • Resolution set to fixed

Per mpedrotti, the issues mentioned in this bug report only appear to affect quite old versions of jQuery (pre 1.3.1) as I can confirm.

As the .attr() problems related to SVG IDLs seem to be ironed out in the releases over the past year or so (and we're obviously unable to patch 1.2.x), we'll be closing this ticket as fixed.

If for any reason we've missed something, please feel free to re-open if required.

comment:12 Changed 4 years ago by timmywil

  • Status changed from closed to reopened
  • Version changed from git to 1.5.2
  • Resolution fixed deleted
  • Milestone changed from 1.next to 1.6

comment:13 Changed 4 years ago by timmywil

  • Owner set to timmywil
  • Status changed from reopened to assigned

I've confirmed this is still an issue in 1.5.2, but it is fixed in attrhooks for 1.6.

comment:14 Changed 4 years ago by timmywil

  • Status changed from assigned to closed
  • Resolution set to fixed

comment:15 Changed 3 years ago by john

  • Component changed from core to attributes

comment:16 Changed 3 years ago by anonymous

only $("#elementID").attr() works, but $(".elementclass").get(0).attr() not work

Note: See TracTickets for help on using tickets.