Function commitMount

packages/react-dom-bindings/src/client/ReactFiberConfigDOM.js:808–867

(
  domElement: Instance,
  type: string,
  newProps: Props,
  internalInstanceHandle: Object,
)

export const supportsMutation = true;

export function commitMount(
  domElement: Instance,
  type: string,
  newProps: Props,
  internalInstanceHandle: Object,
): void {
  class="cm">// Despite the naming that might imply otherwise, this method only
  class="cm">// fires if there is an `Update` effect scheduled during mounting.
  class="cm">// This happens if `finalizeInitialChildren` returns `true` (which it
  class="cm">// does to implement the `autoFocus` attribute on the client). But
  class="cm">// there are also other cases when this might happen (such as patching
  class="cm">// up text content during hydration mismatch). So we'll check this again.
  switch (type) {
    case class="st">'button':
    case class="st">'input':
    case class="st">'select':
    case class="st">'textarea':
      if (newProps.autoFocus) {
        ((domElement: any):
          | HTMLButtonElement
          | HTMLInputElement
          | HTMLSelectElement
          | HTMLTextAreaElement).focus();
      }
      return;
    case class="st">'img': {
      class="cm">// The technique here is to assign the src or srcSet property to cause the browser
      class="cm">// to issue a new load event. If it hasnclass="st">'t loaded yet it'll fire whenever the load actually completes.
      class="cm">// If it has already loaded we missed it so the second load will still be the first one that executes
      class="cm">// any associated onLoad props.
      class="cm">// Even if we have srcSet we prefer to reassign src. The reason is that Firefox does not trigger a new
      class="cm">// load event when only srcSet is assigned. Chrome will trigger a load event if either is assigned so we
      class="cm">// only need to assign one. And Safari just never triggers a new load event which means this technique
      class="cm">// is already a noop regardless of which properties are assigned. We should revisit if browsers update
      class="cm">// this heuristic in the future.
      if (newProps.src) {
        const src = (newProps: any).src;
        if (enableSrcObject && typeof src === class="st">'object') {
          class="cm">// For object src, we can't just set the src again to the same blob URL because it might have
          class="cm">// already revoked if it loaded before this. However, we can create a new blob URL and set that.
          class="cm">// This is relatively cheap since the blob is already in memory but this might cause some
          class="cm">// duplicated work.
          class="cm">// TODO: We could maybe detect if load hasn't fired yet and if so reuse the URL.
          try {
            setSrcObject(domElement, type, src);
            return;
          } catch (x) {
            class="cm">// If URL.createObjectURL() errors, it was probably some other object type
            class="cm">// that should be toString:ed instead, so we just fall-through to the normal
            class="cm">// path.
          }
        }
        ((domElement: any): HTMLImageElement).src = src;
      } else if (newProps.srcSet) {
        ((domElement: any): HTMLImageElement).srcset = (newProps: any).srcSet;
      }
      return;
    }