Svg elements can't be dragged in IE11

[evanfuture]

Bug, feature request, or proposal:

Bug

What is the expected behavior?

Svg elements (g, circle, line, etc) should be able to have the cdkDrag directive applied to them.

What is the current behavior?

In IE11, they can't be dragged.

What are the steps to reproduce?

https://stackblitz.com/edit/angular-material2-issue-jguheq
Try out the above StackBlitz in IE11 (might be faster to skip loading the editor: https://angular-material2-issue-jguheq.stackblitz.io/ )

Note that the circle can not be dragged (but also note that there aren't any errors)

Which versions of Angular, Material, OS, TypeScript, browsers are affected?

Angular 7, Material's new drag and drop module.

Is there anything else we should know?

I will have a PR for this prepared soon (once I write some tests). The issue is that IE11 does not acknowledge the transform css property when it changes. It does, however work if you set the transform html property using setAttribute. (caveat though, IE11 reads the style.transform value as a matrix3d() string, but refuses to see setAttribute changes unless they are matrix() strings. My fix handles this.

[angular-automatic-lock-bot]

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}