From d981c337ebf99d5da39991bd84795a303f1e4f49 Mon Sep 17 00:00:00 2001
From: bnymncoskuner <bnymncoskuner@gmail.com>
Date: Tue, 12 Oct 2021 16:59:56 +0300
Subject: [PATCH 1/2] feat: add element options to content strategy

---
 .../src/lib/strategies/content.strategy.ts    | 25 +++++++++++++------
 1 file changed, 17 insertions(+), 8 deletions(-)

diff --git a/npm/ng-packs/packages/core/src/lib/strategies/content.strategy.ts b/npm/ng-packs/packages/core/src/lib/strategies/content.strategy.ts
index 05261bc5e4..839e867f41 100644
--- a/npm/ng-packs/packages/core/src/lib/strategies/content.strategy.ts
+++ b/npm/ng-packs/packages/core/src/lib/strategies/content.strategy.ts
@@ -1,11 +1,16 @@
 import { ContentSecurityStrategy, CONTENT_SECURITY_STRATEGY } from './content-security.strategy';
 import { DomStrategy, DOM_STRATEGY } from './dom.strategy';
 
+export type ElementOptions<T extends HTMLScriptElement | HTMLStyleElement = any> = Partial<{
+  [key in keyof T]: T[key];
+}>;
+
 export abstract class ContentStrategy<T extends HTMLScriptElement | HTMLStyleElement = any> {
   constructor(
     public content: string,
     protected domStrategy: DomStrategy = DOM_STRATEGY.AppendToHead(),
     protected contentSecurityStrategy: ContentSecurityStrategy = CONTENT_SECURITY_STRATEGY.None(),
+    protected options: ElementOptions<T> = {},
   ) {}
 
   abstract createElement(): T;
@@ -13,6 +18,10 @@ export abstract class ContentStrategy<T extends HTMLScriptElement | HTMLStyleEle
   insertElement(): T {
     const element = this.createElement();
 
+    if (this.options && Object.keys(this.options).length > 0) {
+      Object.keys(this.options).forEach(key => (element[key] = this.options[key]));
+    }
+
     this.contentSecurityStrategy.applyCSP(element);
     this.domStrategy.insertElement(element);
 
@@ -39,16 +48,16 @@ export class ScriptContentStrategy extends ContentStrategy<HTMLScriptElement> {
 }
 
 export const CONTENT_STRATEGY = {
-  AppendScriptToBody(content: string) {
-    return new ScriptContentStrategy(content, DOM_STRATEGY.AppendToBody());
+  AppendScriptToBody(content: string, options?: ElementOptions<HTMLScriptElement>) {
+    return new ScriptContentStrategy(content, DOM_STRATEGY.AppendToBody(), undefined, options);
   },
-  AppendScriptToHead(content: string) {
-    return new ScriptContentStrategy(content, DOM_STRATEGY.AppendToHead());
+  AppendScriptToHead(content: string, options?: ElementOptions<HTMLScriptElement>) {
+    return new ScriptContentStrategy(content, DOM_STRATEGY.AppendToHead(), undefined, options);
   },
-  AppendStyleToHead(content: string) {
-    return new StyleContentStrategy(content, DOM_STRATEGY.AppendToHead());
+  AppendStyleToHead(content: string, options?: ElementOptions<HTMLStyleElement>) {
+    return new StyleContentStrategy(content, DOM_STRATEGY.AppendToHead(), undefined, options);
   },
-  PrependStyleToHead(content: string) {
-    return new StyleContentStrategy(content, DOM_STRATEGY.PrependToHead());
+  PrependStyleToHead(content: string, options?: ElementOptions<HTMLStyleElement>) {
+    return new StyleContentStrategy(content, DOM_STRATEGY.PrependToHead(), undefined, options);
   },
 };

From 57e9f3856449ba7992654a0493ee0c5fed6ba4a0 Mon Sep 17 00:00:00 2001
From: bnymncoskuner <bnymncoskuner@gmail.com>
Date: Tue, 12 Oct 2021 17:00:55 +0300
Subject: [PATCH 2/2] docs: add new option in Content Strategy

---
 docs/en/UI/Angular/Content-Strategy.md | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/docs/en/UI/Angular/Content-Strategy.md b/docs/en/UI/Angular/Content-Strategy.md
index 8544042c32..cb06ecf044 100644
--- a/docs/en/UI/Angular/Content-Strategy.md
+++ b/docs/en/UI/Angular/Content-Strategy.md
@@ -11,13 +11,15 @@
 constructor(
   public content: string,
   protected domStrategy?: DomStrategy,
-  protected contentSecurityStrategy?: ContentSecurityStrategy
+  protected contentSecurityStrategy?: ContentSecurityStrategy,
+  protected options?: ElementOptions = {},
 )
 ```
 
 - `content` is set to `<script>` and `<style>` elements as `textContent` property.
 - `domStrategy` is the `DomStrategy` that will be used when inserting the created element. (_default: AppendToHead_)
 - `contentSecurityStrategy` is the `ContentSecurityStrategy` that will be used on the created element before inserting it. (_default: None_)
+- `options` can be used to pass any option to the element that will be created. e.g: `{ id: "some-id" }` (_default: empty object_)
 
 Please refer to [DomStrategy](./Dom-Strategy.md) and [ContentSecurityStrategy](./Content-Security-Strategy.md) documentation for their usage.
 
@@ -57,7 +59,7 @@ Predefined content strategies are accessible via `CONTENT_STRATEGY` constant.
 ### AppendScriptToBody
 
 ```js
-CONTENT_STRATEGY.AppendScriptToBody(content: string)
+CONTENT_STRATEGY.AppendScriptToBody(content: string, options?: ElementOptions<HTMLScriptElement>)
 ```
 
 Creates a `<script>` element with the given content and places it at the **end** of `<body>` tag in the document.
@@ -66,7 +68,7 @@ Creates a `<script>` element with the given content and places it at the **end**
 ### AppendScriptToHead
 
 ```js
-CONTENT_STRATEGY.AppendScriptToHead(content: string)
+CONTENT_STRATEGY.AppendScriptToHead(content: string, options?: ElementOptions<HTMLScriptElement>)
 ```
 
 Creates a `<script>` element with the given content and places it at the **end** of `<head>` tag in the document.
@@ -75,7 +77,7 @@ Creates a `<script>` element with the given content and places it at the **end**
 ### AppendStyleToHead
 
 ```js
-CONTENT_STRATEGY.AppendStyleToHead(content: string)
+CONTENT_STRATEGY.AppendStyleToHead(content: string, options?: ElementOptions<HTMLStyleElement>)
 ```
 
 Creates a `<style>` element with the given content and places it at the **end** of `<head>` tag in the document.
@@ -84,7 +86,7 @@ Creates a `<style>` element with the given content and places it at the **end**
 ### PrependStyleToHead
 
 ```js
-CONTENT_STRATEGY.PrependStyleToHead(content: string)
+CONTENT_STRATEGY.PrependStyleToHead(content: string, options?: ElementOptions<HTMLStyleElement>)
 ```
 
 Creates a `<style>` element with the given content and places it at the **beginning** of `<head>` tag in the document.