Copying code causes an error message. about chatbot-ui HOT 15 CLOSED

I am using Google Chrome und Mac OS. Version 111.0.5563.64 (Official Build) (x86_64).

from chatbot-ui.

I just pushed a fix that will prevent that error, but it will return the function such that it won't copy.

It appears to be a case where your clipboard api is unaccessible.

I confirm the patch. :)

from chatbot-ui.

No worries! We at least got rid of that horrible error message. I'll come up with a UX fix here for better visiblility.

from chatbot-ui.

Hi, as far as I understand this, clipboard access is only possible in "secure contexts" - i.e. opened via HTTPS or from localhost. This seems to be the case for Chrome and Firefox.

https://developer.mozilla.org/en-US/docs/Web/API/Clipboard

from chatbot-ui.

What browser?

from chatbot-ui.

What browser?

Same problem in Chrome.

from chatbot-ui.

I wonder if either of you have anything enabled that controls your clipboard. Any extensions maybe?

from chatbot-ui.

I wonder if either of you have anything enabled that controls your clipboard. Any extensions maybe?

Not really. I also checked the Privacy and Security settings. Sites can ask to see text and images on my clipboard. I also tried to add the page explicitly, but without success.

This is the detailed error message.

Unhandled Runtime Error
TypeError: Cannot read properties of undefined (reading 'writeText')

Source
components/Markdown/CodeBlock.tsx (17:28) @ writeText

15 |
16 | const copyToClipboard = () => {

17 | navigator.clipboard.writeText(value).then(() => {
| ^
18 | setButtonText("Copied!");
19 |
20 | setTimeout(() => {
Call Stack
HTMLUnknownElement.callCallback
node_modules/react-dom/cjs/react-dom.development.js (4164:0)
Object.invokeGuardedCallbackDev
node_modules/react-dom/cjs/react-dom.development.js (4213:0)
invokeGuardedCallback
node_modules/react-dom/cjs/react-dom.development.js (4277:0)
invokeGuardedCallbackAndCatchFirstError
node_modules/react-dom/cjs/react-dom.development.js (4291:0)
executeDispatch
node_modules/react-dom/cjs/react-dom.development.js (9041:0)
processDispatchQueueItemsInOrder
node_modules/react-dom/cjs/react-dom.development.js (9073:0)
processDispatchQueue
node_modules/react-dom/cjs/react-dom.development.js (9086:0)
dispatchEventsForPlugins
node_modules/react-dom/cjs/react-dom.development.js (9097:0)
eval
node_modules/react-dom/cjs/react-dom.development.js (9288:0)
batchedUpdates$1
node_modules/react-dom/cjs/react-dom.development.js (26140:0)
batchedUpdates
node_modules/react-dom/cjs/react-dom.development.js (3991:0)
dispatchEventForPluginEventSystem
node_modules/react-dom/cjs/react-dom.development.js (9287:0)
dispatchEventWithEnableCapturePhaseSelectiveHydrationWithoutDiscreteEventReplay
node_modules/react-dom/cjs/react-dom.development.js (6465:0)
dispatchEvent
node_modules/react-dom/cjs/react-dom.development.js (6457:0)
dispatchDiscreteEvent
node_modules/react-dom/cjs/react-dom.development.js (6430:0)
Hide collapsed frames

from chatbot-ui.

I just pushed a fix that will prevent that error, but it will return the function such that it won't copy.

It appears to be a case where your clipboard api is unaccessible.

from chatbot-ui.

Working Fine in my case.

OS: Linux
Browser: Chrome (Latest Version)

from chatbot-ui.

Quick follow up - was this locally run or from chatbotui.com?

from chatbot-ui.

I am running it on my home server in a Proxmox container.

from chatbot-ui.

Working fine on both the local and chatbotui.com servers.

from chatbot-ui.

When I run it in a Docker container it works perfectly. Could it be an incompatibility with the Node.js version, etc?

from chatbot-ui.

The problem is somehow my browser setting. I apologise for the inconvenience.

from chatbot-ui.