From b280d54470c5aed90d3cfe5dbf50c2431890eeb8 Mon Sep 17 00:00:00 2001
From: George Kalpakas <kalpakas.g@gmail.com>
Date: Wed, 29 Jul 2020 17:38:12 +0300
Subject: [PATCH] refactor(docs-infra): simplify/improve `CopierService` hidden
 textarea creation (#38244)

This commit simplifies the creation of the temporary, hidden
`<textarea>` element used by `CopierService` by switching from absolute
to fixed positioning and not requiring page's scroll offset.

It also makes the following minor improvements:
- Make the element invisible (via `opacity: 0`).
- Instruct screen-readers to ignore the element (via
  `aria-hidden: true`).

NOTE: These improvements are based on Angular CDK's [PendingCopy][1]
      class and the changes proposed in PR angular/components#20073.

[1]: https://github.com/angular/components/blob/89b5fa89d1437c3054c5/src/cdk/clipboard/pending-copy.ts

PR Close #38244
---
 aio/src/app/shared/copier.service.ts | 13 ++++++-------
 1 file changed, 6 insertions(+), 7 deletions(-)

diff --git a/aio/src/app/shared/copier.service.ts b/aio/src/app/shared/copier.service.ts
index 420d8ef683..4b571de452 100644
--- a/aio/src/app/shared/copier.service.ts
+++ b/aio/src/app/shared/copier.service.ts
@@ -59,14 +59,13 @@ export class CopierService {
     style.padding = '0';
     style.margin = '0';
 
-    // Move element out of screen horizontally.
-    style.position = 'absolute';
-    style[ isRTL ? 'right' : 'left' ] = '-9999px';
-
-    // Move element to the same position vertically.
-    const yPosition = window.pageYOffset || docElem.scrollTop;
-    style.top = yPosition + 'px';
+    // Make the element invisible and move it out of screen horizontally.
+    style.opacity = '0';
+    style.position = 'fixed';
+    style.top = '0';
+    style[isRTL ? 'right' : 'left'] = '-999em';
 
+    textArea.setAttribute('aria-hidden', 'true');
     textArea.setAttribute('readonly', '');
     textArea.value = text;