react-auth-code-input icon indicating copy to clipboard operation
react-auth-code-input copied to clipboard

Cannot read properties of null (reading 'getData')

Open NazariiShvets opened this issue 9 months ago • 0 comments

Hi, I'm using your library in my project We have Sentry for monitoring, and recently we started to catch such issues

image

Issue itself is strange, as for Chrome 124.0.0 clipboardData API, according to can-i-use, is supported I would assume this is custom security options selected by user, or any other strange setup

Anyway, I believe issue can be resolved by adding fallback for clipboardData to navigator.clipboard.readText(), in case clipboardData is unavailable. And adding try-catch block with empty string as fallback, in case API is unavailable for user

async function getPastedValue(e: ClipboardEvent<HTMLInputElement>) {
  try {
    if(e.clipboardData) {
      return e.clipboardData.getData('Text')
    }
    
    if(navigator.clipboard) {
      const pastedValue = await navigator.clipboard.readText();
      
      return pastedValue
    }
    
    return ''
  } catch(e) {
    return ''
  }
}

NazariiShvets avatar Apr 29 '24 06:04 NazariiShvets