{"action":"created","issue":{"url":"https://api.github.com/repos/angular/angular/issues/5654","labels_url":"https://api.github.com/repos/angular/angular/issues/5654/labels{/name}","comments_url":"https://api.github.com/repos/angular/angular/issues/5654/comments","events_url":"https://api.github.com/repos/angular/angular/issues/5654/events","html_url":"https://github.com/angular/angular/issues/5654","id":120636971,"number":5654,"title":"Strange bug in alpha 48 with svg graphics","user":{"login":"user414","id":15663459,"avatar_url":"https://avatars.githubusercontent.com/u/15663459?v=3","gravatar_id":"","url":"https://api.github.com/users/user414","html_url":"https://github.com/user414","followers_url":"https://api.github.com/users/user414/followers","following_url":"https://api.github.com/users/user414/following{/other_user}","gists_url":"https://api.github.com/users/user414/gists{/gist_id}","starred_url":"https://api.github.com/users/user414/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/user414/subscriptions","organizations_url":"https://api.github.com/users/user414/orgs","repos_url":"https://api.github.com/users/user414/repos","events_url":"https://api.github.com/users/user414/events{/privacy}","received_events_url":"https://api.github.com/users/user414/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":2,"created_at":"2015-12-06T14:15:48Z","updated_at":"2015-12-06T17:14:13Z","closed_at":null,"body":"This is strange and took me a while to come up with a simple test case, this worked in alpha 46 and no longer works in alpha 48. If you use the html below in straight browser and in a component with alpha 46, you end up with a 40px square. However, in alpha 48 you end up with a 200px square. \r\n\r\n```\r\n<div style=\"width: 40px; height: 40px\">\r\n\t<svg viewbox=\"0 0 200 200\">\r\n\t\t<rect width=\"200\" height=\"200\"/>\r\n\t</svg>\r\n</div>\r\n```\r\n\r\nFor others who might be struggling with this the way to fix this in the meantime in alpha 48 is to insert a scale transform like this\r\n\r\n```\r\n<div style=\"width: 40px; height: 40px\">\r\n       <g transform=\"scale(0.2)\">\r\n\t<svg viewbox=\"0 0 200 200\">\r\n\t\t<rect width=\"200\" height=\"200\"/>\r\n\t</svg>\r\n         </g> \r\n</div>\r\n```\r\n\r\nSomething in alpha 48 is producing something different then the straight browser behavior and alpha 46 some I'm assuming that's the culprit and not alpha 46. However, by a quick check of the w3 specs it might seem that the correct literal rendering might be alpha 48 and browsers are automagically doing a scaling in the background. Nonetheless, inconsistent behavior is a bigger problem so I think alpha 48 is the one that should be fixed.\r\n\r\n\r\n"},"comment":{"url":"https://api.github.com/repos/angular/angular/issues/comments/162329884","html_url":"https://github.com/angular/angular/issues/5654#issuecomment-162329884","issue_url":"https://api.github.com/repos/angular/angular/issues/5654","id":162329884,"user":{"login":"user414","id":15663459,"avatar_url":"https://avatars.githubusercontent.com/u/15663459?v=3","gravatar_id":"","url":"https://api.github.com/users/user414","html_url":"https://github.com/user414","followers_url":"https://api.github.com/users/user414/followers","following_url":"https://api.github.com/users/user414/following{/other_user}","gists_url":"https://api.github.com/users/user414/gists{/gist_id}","starred_url":"https://api.github.com/users/user414/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/user414/subscriptions","organizations_url":"https://api.github.com/users/user414/orgs","repos_url":"https://api.github.com/users/user414/repos","events_url":"https://api.github.com/users/user414/events{/privacy}","received_events_url":"https://api.github.com/users/user414/received_events","type":"User","site_admin":false},"created_at":"2015-12-06T17:14:13Z","updated_at":"2015-12-06T17:14:13Z","body":"Now I don't have it in front of me, but If I remember correctly the DOM structure was similar but the computed attribute of each element like width/height/etc... was definitely different between 46 and 48. I tried to make a simpler test code without the SVG, but I don't think I understand enough the internals to do that in a reasonable amount of time."}}