Function testStringCoercion

packages/shared/CheckStringCoercion.js:47–72

@noinline

(value: mixed)

/** @noinline */
function testStringCoercion(value: mixed) {
  class="cm">// If you ended up here by following an exception call stack, hereclass="st">'s what's
  class="cm">// happened: you supplied an object or symbol value to React (as a prop, key,
  class="cm">// DOM attribute, CSS property, string ref, etc.) and when React tried to
  class="cm">// coerce it to a string using `class="st">'' + value`, an exception was thrown.
  class="cm">//
  class="cm">// The most common types that will cause this exception are `Symbol` instances
  class="cm">// and Temporal objects like `Temporal.Instant`. But any object that has a
  class="cm">// `valueOf` or `[Symbol.toPrimitive]` method that throws will also cause this
  class="cm">// exception. (Library authors do this to prevent users from using built-in
  class="cm">// numeric operators like `+` or comparison operators like `>=` because custom
  class="cm">// methods are needed to perform accurate arithmetic or comparison.)
  class="cm">//
  class="cm">// To fix the problem, coerce this object or symbol value to a string before
  class="cm">// passing it to React. The most reliable way is usually `String(value)`.
  class="cm">//
  class="cm">// To find which value is throwing, check the browser or debugger console.
  class="cm">// Before this exception was thrown, there should be `console.error` output
  class="cm">// that shows the type (Symbol, Temporal.PlainDate, etc.) that caused the
  class="cm">// problem and how that type was used: key, atrribute, input value prop, etc.
  class="cm">// In most cases, this console output also shows the component and its
  class="cm">// ancestor components where the exception happened.
  class="cm">//
  class="cm">// eslint-disable-next-line react-internal/safe-string-coercion
  return class="st">'' + (value: any);
}

export function checkAttributeStringCoercion(
  value: mixed,