From 5b8eb1c50f2c778cd3d1be1b3167dfdeea58d21d Mon Sep 17 00:00:00 2001
From: Kristiyan Kostadinov <crisbeto@abv.bg>
Date: Fri, 14 Jul 2023 11:52:28 +0200
Subject: [PATCH] fix(cdk/clipboard): not working inside fullscreen element

Fixes that the clipboard service didn't work when the page is fullscreen.

Fixes #27447.
---
 src/cdk/clipboard/pending-copy.ts         | 4 +++-
 src/dev-app/clipboard/clipboard-demo.html | 5 +++++
 2 files changed, 8 insertions(+), 1 deletion(-)

diff --git a/src/cdk/clipboard/pending-copy.ts b/src/cdk/clipboard/pending-copy.ts
index 00f31ae450b1..61cf922579b9 100644
--- a/src/cdk/clipboard/pending-copy.ts
+++ b/src/cdk/clipboard/pending-copy.ts
@@ -36,7 +36,9 @@ export class PendingCopy {
     textarea.value = text;
     // Making the textarea `readonly` prevents the screen from jumping on iOS Safari (see #25169).
     textarea.readOnly = true;
-    this._document.body.appendChild(textarea);
+    // The element needs to be inserted into the fullscreen container, if the page
+    // is in fullscreen mode, otherwise the browser won't execute the copy command.
+    (this._document.fullscreenElement || this._document.body).appendChild(textarea);
   }
 
   /** Finishes copying the text. */
diff --git a/src/dev-app/clipboard/clipboard-demo.html b/src/dev-app/clipboard/clipboard-demo.html
index 9d9834924dcf..7efb7e9362ce 100644
--- a/src/dev-app/clipboard/clipboard-demo.html
+++ b/src/dev-app/clipboard/clipboard-demo.html
@@ -12,3 +12,8 @@
 <button
   [cdkCopyToClipboard]="value"
   [cdkCopyToClipboardAttempts]="attempts">Copy to clipboard via directive</button>
+
+<section>
+  <label for="testing-area">Testing area</label>
+  <textarea id="testing-area" cols="30" rows="5"></textarea>
+</section>