# Copy to clipboard doesn't work

**URL:** <https://community.hubspot.com/t/copy-to-clipboard-doesnt-work/110910>\
**Category:** APIs & Integrations\
**Tags:** developer-tools\
**Created:** [July 9, 2024, 7:19am UTC](https://community.hubspot.com/t/copy-to-clipboard-doesnt-work/110910 "2024-07-09T07:19:55Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![JMacasero](https://avatars.discourse-cdn.com/v4/letter/j/aca169/32.png) [@JMacasero](https://community.hubspot.com/u/JMacasero)\
**Post date:** [July 9, 2024, 7:19am UTC](https://community.hubspot.com/t/copy-to-clipboard-doesnt-work/110910/1 "2024-07-09T07:19:55Z")

</div>

I am creating a custom CRM card and I want to implement functionality like copying text or copying to the clipboard, but I keep encountering an error.  
**Failed to copy: Cannot read properties of undefined (reading ‘writeText’)**  
Here is what i’ve done :

```lia-code-sample
const copyToClipBoard = async (copyType, copyText) => {
 try {
 await navigator.clipboard.writeText(copyText); 
 sendAlert({
 message: `${copyType} copied to clipboard!`,
 });
 } catch (err) {
 sendAlert({
 message: `Failed to copy: ${err.message}`,
 variant: "error",
 });
 }
};

<Button
 onClick={() =>
 copyToClipBoard("Email Subject",email.scheduledEmail.subject)
 }
 variant="primary"
 size="sm"
 type="button"
>
 Copy Subject
</Button>

```

---

<div class="post-metadata">

**Author:** ![Danielle\_J](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/danielle_j/32/16530_2.png) [@Danielle\_J](https://community.hubspot.com/u/Danielle_J)\
**Post date:** [July 9, 2024, 9:51am UTC](https://community.hubspot.com/t/copy-to-clipboard-doesnt-work/110910/2 "2024-07-09T09:51:10Z")

</div>

Hi there,  
For HubSpot UI extensions, don’t use the browser’s `navigator.clipboard.writeText()` API directly. Use HubSpot’s UI Extensions SDK clipboard action (`copyTextToClipboard`) instead:

1. Ensure that the Clipboard API is supported in the browser you’re using. Perhaps add a simple check before calling the **writeText** method.
2. I believe the Clipboard API only works in secure contexts (HTTPS). Make sure your application is served over HTTPS.
3. Ensure that the site has permissions to access the clipboard.

> **[Actions - HubSpot docs](https://developers.hubspot.com/docs/apps/developer-platform/add-features/ui-extensions/ui-extensions-sdk/actions)**
>
> Reference information for actions provided by the UI extensions SDK.

I would also add some additional validation to your code, something like:

```lia-code-sample
const copyToClipBoard = async (copyType, copyText) => {
 if (!navigator.clipboard) {
 sendAlert({
 message: `Clipboard API is not supported in your browser.`,
 variant: "error",
 });
 return;
 }

```

I hope this helps.

_Moderator Note: this post was reviewed for relevancy and optimized for clarity on September 30, 2026. Thank you for your contributions to the HubSpot Community!_

---

<div class="post-metadata">

**Author:** ![JMacasero](https://avatars.discourse-cdn.com/v4/letter/j/aca169/32.png) [@JMacasero](https://community.hubspot.com/u/JMacasero)\
**Post date:** [July 9, 2024, 12:28pm UTC](https://community.hubspot.com/t/copy-to-clipboard-doesnt-work/110910/3 "2024-07-09T12:28:43Z")

</div>

[@Danielle\_J](https://community.hubspot.com/t5/user/viewprofilepage/user-id/673740) thank you for your respose.  
I’ve already updated my google chrome browser from its latest version. Talking about https, its already https protocol since its from hubspot contacts.  
How may i know if the site has permissions to acces the clipboard ?