Remove setting dom policy during view template creation (#7130)

# Pull Request

## 📖 Description

We may provide a hook for this later, but at present time it triggers the CSP trusted-types duplication error.

## ✅ Checklist

### General

- [x] I have included a change request file using `$ npm run change`
- [ ] I have added tests for my changes.
- [x] I have tested my changes.
- [ ] I have updated the project documentation to reflect my changes.
- [x] I have read the [CONTRIBUTING](https://github.com/microsoft/fast/blob/main/CONTRIBUTING.md) documentation and followed the [standards](https://github.com/microsoft/fast/blob/main/CODE_OF_CONDUCT.md#our-standards) for this project.

Author: janechu

change/@microsoft-fast-html-b91c600d-9520-4204-bf38-c5677e9b5a3b.json

@@ -0,0 +1,7 @@
+{
+  "type": "prerelease",
+  "comment": "Remove setting explicit DOM policy as this causes an issue with CSP duplicate policy creation",
+  "packageName": "@microsoft/fast-html",
+  "email": "[email protected]",
+  "dependentChangeType": "none"
+}

packages/web-components/fast-html/server/server.ts

@@ -14,6 +14,7 @@ function handlePathRequest(
     res: Response
 ) {
     res.set("Content-Type", contentType);
+    res.set("Content-Security-Policy", "trusted-types fast-html");
     fs.readFile(path.resolve(__dirname, mapPath), { encoding: "utf8" }, (err, data) => {
         const stream = (Readable as any).from(data);
 

packages/web-components/fast-html/src/components/template.ts

@@ -1,7 +1,5 @@
 import {
     attr,
-    DOMAspect,
-    DOMSink,
     FAST,
     FASTElement,
     FASTElementDefinition,
@@ -11,7 +9,6 @@ import {
     ViewTemplate,
 } from "@microsoft/fast-element";
 import "@microsoft/fast-element/install-hydratable-view-templates.js";
-import { DOMPolicy } from "@microsoft/fast-element/dom-policy.js";
 import { Message } from "../interfaces.js";
 import {
     AttributeDirective,
@@ -31,17 +28,6 @@ interface ResolvedStringsAndValues {
     values: Array<any>;
 }
 
-function allow(
-    tagName: string | null,
-    aspect: DOMAspect,
-    aspectName: string,
-    sink: DOMSink
-): DOMSink {
-    return (target: Node, name: string, value: string, ...rest: any[]) => {
-        sink(target, name, value, ...rest);
-    };
-}
-
 export interface ElementOptions {
     shadowOptions?: ShadowRootOptions | undefined;
 }
@@ -184,19 +170,7 @@ class TemplateElement extends FASTElement {
         strings: Array<string>,
         values: Array<any>
     ): ViewTemplate<any, any> {
-        return ViewTemplate.create(
-            strings,
-            values,
-            DOMPolicy.create({
-                guards: {
-                    aspects: {
-                        [DOMAspect.property]: {
-                            innerHTML: allow,
-                        },
-                    },
-                },
-            })
-        );
+        return ViewTemplate.create(strings, values);
     }
 
     /**