Repository: angular
Issue: Cannot bind SafeUrl to SVGImageElement
Labels: area: core,area: security,core: sanitization,P4

<!--🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅

Oh hi there! 😄

To expedite issue processing please search open and closed issues before submitting a new one.
Existing issues often contain information about workarounds, resolution, or progress updates.

🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅🔅-->


# 🐞 bug report

### Affected Package
<!-- Can you pin-point one or more @angular/* packages as the source of the bug? -->
<!-- ✍️edit: --> The issue is likely caused by package @angular/core


### Is this a regression?

<!-- Did this behavior use to work in the previous version? -->
<!-- ✍️--> No. If it is a regression, I'm not aware of it.


### Description

I have a template that is a more complex version of this:

```html
<svg xmlns="http://www.w3.org/2000/svg" id="svg">
    <image [attr.href]="aSafeUrl"></image>
</svg>

```

At runtime, no image is shown, no error is in the JavaScript console, and the DOM look like this (simplified):

```html
<svg xmlns="http://www.w3.org/2000/svg" id="svg">
    <image href="SafeValue must use [property]=binding: app://localhost/path/image.png (see http://g.co/ng/security#xss)"></image>
</svg>
```

Is suspect that the proper binding for SafeUrls to _SVGImageElement.href_ is missing.

When I use an [href] binding instead of [attr.href] Angular tells me that I'm trying to bind to a readonly property.

##### Context
This is part of an Apache Cordova project targeting the latest iOS version. _iOS/cordova-ios@6_ considers the _file:_ protocol to be unsafe, so we use the synthetic _app://localhost_ protocol and host. That's probably why Angular deems the URLs to be unsafe. We wrap them using _DomSanitizer.bypassSecurityTrustUrl()_, but it seems that we can only use SafeUrls with specific bindings, which don't exist for SVGImageElements. We use SVGs to support taking notes on images.



## 🔬 Minimal Reproduction
<!--
Please create and share minimal reproduction of the issue starting with this template: https://stackblitz.com/fork/angular-ivy
-->
<!-- ✍️--> <!--https://stackblitz.com/...-->

<!--
If StackBlitz is not suitable for reproduction of your issue, please create a minimal GitHub repository with the reproduction of the issue.
A good way to make a minimal reproduction is to create a new app via `ng new repro-app` and add the minimum possible code to show the problem.
Share the link to the repo below along with step-by-step instructions to reproduce the problem, as well as expected and actual behavior.

Issues that don't have enough info and can't be reproduced will be closed.

You can read more about issue submission guidelines here: https://github.com/angular/angular/blob/master/CONTRIBUTING.md#-submitting-an-issue
-->

## 🔥 Exception or Error
<!-- If the issue is accompanied by an exception or an error, please share it below: -->
<pre><code>SafeValue must use [property]=binding: app://localhost/path/image.png (see http://g.co/ng/security#xss)</code></pre>


## 🌍  Your Environment

**Angular Version:**
<!-- run `ng version` and paste output below -->
<pre><code>Angular CLI: 9.1.7
Node: 12.16.3
OS: darwin x64

Angular: 9.1.11
... animations, common, compiler, compiler-cli, core, forms
... platform-browser, platform-browser-dynamic, platform-server
... router
Ivy Workspace: Yes

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.901.7
@angular-devkit/build-angular     0.901.8
@angular-devkit/build-optimizer   0.901.8
@angular-devkit/build-webpack     0.901.8
@angular-devkit/core              9.1.7
@angular-devkit/schematics        9.1.7
@angular/cli                      9.1.7
@angular/http                     4.4.7
@ngtools/webpack                  9.1.8
@schematics/angular               9.1.7
@schematics/update                0.901.7
rxjs                              6.5.5
typescript                        3.8.3
webpack                           4.43.0
</code></pre>

**Anything else relevant?**
<!-- ✍️Is this a browser specific issue? If so, please specify the browser and version. -->

<!-- ✍️Do any of these matter: operating system, IDE, package manager, HTTP server, ...? If so, please mention it below. -->
We don't use the Angular CLI for building.