Data bindings don't seem to work when element attributes are hyphenated

[DavidPesta]

I've been testing Agility.js with SVG. Data bindings don't seem to work for element attributes that have a hyphen in them.

The following works for stroke-width, giving the circle a stroke width of 10:

var obj = $$(
  {
    radius: 200,
    centerx: 300,
    centery: 300
  },
  ' \
  <svg> \
    <circle stroke="black" fill="red" stroke-width="10" data-bind="r radius, cx centerx, cy centery" /> \
  </svg> \
  '
);
$$.document.append(obj);

But the following does not work for the stroke-width element attribute:

var obj = $$(
  {
    radius: 200,
    centerx: 300,
    centery: 300,
    strokeWidth: 10
  },
  ' \
  <svg> \
    <circle stroke="black" fill="red" data-bind="r radius, cx centerx, cy centery, stroke-width strokeWidth" /> \
  </svg> \
  '
);
$$.document.append(obj);

I hope this is helpful!

[tlack]

I believe this is because in parseBindStr (around line 436), the regex used for the match is /(\w+)(?:\s+(\w+))?/ .. \w doesn't match dashes. should probably just use [a-zA-Z0-9-].

[tristanls]

@DavidPesta thank you for finding the issue.

@tlack thanks for the suggestion :D

[arturadib]

Thanks guys, this is awesome progress!

[tristanls]

Implemented in #63