Method componentDidUpdate

lib/components/term.tsx:336–393

(prevProps: TermProps)

  }

  componentDidUpdate(prevProps: TermProps) {
    if (!prevProps.cleared && this.props.cleared) {
      this.clear();
    }

    const nextTermOptions = getTermOptions(this.props);

    // Use bellSound in nextProps if it exists
    // otherwise use the default sound found in xterm.
    nextTermOptions.bellSound = this.props.bellSound || this.termDefaultBellSound!;

    if (!prevProps.search && this.props.search) {
      this.search();
    }

    // Update only options that have changed.
    ObjectTypedKeys(nextTermOptions)
      .filter((option) => option !== 'theme' && nextTermOptions[option] !== this.termOptions[option])
      .forEach((option) => {
        try {
          this.term.setOption(option, nextTermOptions[option]);
        } catch (_e) {
          const e = _e as {message: string};
          if (/The webgl renderer only works with the webgl char atlas/i.test(e.message)) {
            // Ignore this because the char atlas will also be changed
          } else {
            throw e;
          }
        }
      });

    // Do we need to update theme?
    const shouldUpdateTheme =
      !this.termOptions.theme ||
      nextTermOptions.rendererType !== this.termOptions.rendererType ||
      ObjectTypedKeys(nextTermOptions.theme!).some(
        (option) => nextTermOptions.theme![option] !== this.termOptions.theme![option]
      );
    if (shouldUpdateTheme) {
      this.term.setOption('theme', nextTermOptions.theme);
    }

    this.termOptions = nextTermOptions;

    if (
      this.props.fontSize !== prevProps.fontSize ||
      this.props.fontFamily !== prevProps.fontFamily ||
      this.props.lineHeight !== prevProps.lineHeight ||
      this.props.letterSpacing !== prevProps.letterSpacing
    ) {
      // resize to fit the container
      this.fitResize();
    }

    if (prevProps.rows !== this.props.rows || prevProps.cols !== this.props.cols) {
      this.resize(this.props.cols!, this.props.rows!);
    }
  }