How to use the @jupyterlab/apputils.DOMUtils.findElement function in @jupyterlab/apputils

updateItemNode(
      node: HTMLElement,
      model: Contents.IModel,
      fileType?: DocumentRegistry.IFileType
    ): void {
      let icon = DOMUtils.findElement(node, ITEM_ICON_CLASS);
      let text = DOMUtils.findElement(node, ITEM_TEXT_CLASS);
      let modified = DOMUtils.findElement(node, ITEM_MODIFIED_CLASS);

      if (fileType) {
        icon.textContent = fileType.iconLabel || '';
        icon.className = `${ITEM_ICON_CLASS} ${fileType.iconClass || ''}`;
      } else {
        icon.textContent = '';
        icon.className = ITEM_ICON_CLASS;
      }

      node.title = model.name;
      // If an item is being edited currently, its text node is unavailable.
      if (text) {
        text.textContent = model.name;
      }

      let modText = '';

updateItemNode(
      node: HTMLElement,
      model: Contents.IModel,
      fileType?: DocumentRegistry.IFileType
    ): void {
      let icon = DOMUtils.findElement(node, ITEM_ICON_CLASS);
      let text = DOMUtils.findElement(node, ITEM_TEXT_CLASS);
      let modified = DOMUtils.findElement(node, ITEM_MODIFIED_CLASS);

      if (fileType) {
        // TODO: remove workaround if...else/code in else clause in v2.0.0
        // workaround for 1.0.x versions of Jlab pulling in 1.1.x versions of filebrowser
        if (this._iconRegistry) {
          // add icon as svg node. Can be styled using CSS
          this._iconRegistry.icon({
            name: fileType.iconClass,
            className: ITEM_ICON_CLASS,
            title: fileType.iconLabel,
            fallback: true,
            container: icon,
            center: true,
            kind: 'listing'
          });

private _evtClick(event: MouseEvent): void {
    // Fetch common variables.
    let termSection = DOMUtils.findElement(this.node, TERMINALS_CLASS);
    let termList = DOMUtils.findElement(termSection, LIST_CLASS);
    let sessionSection = DOMUtils.findElement(this.node, SESSIONS_CLASS);
    let sessionList = DOMUtils.findElement(sessionSection, LIST_CLASS);
    let refresh = DOMUtils.findElement(this.node, REFRESH_CLASS);
    let shutdownTerms = DOMUtils.findElement(
      this.node,
      SHUTDOWN_TERMINALS_CLASS
    );
    let shutdownSessions = DOMUtils.findElement(
      this.node,
      SHUTDOWN_SESSIONS_CLASS
    );
    let renderer = this._renderer;
    let clientX = event.clientX;
    let clientY = event.clientY;

    // Check for a refresh.
    if (ElementExt.hitTest(refresh, clientX, clientY)) {
      this.refresh();
      return;
    }

private _evtClick(event: MouseEvent): void {
    // Fetch common variables.
    let termSection = DOMUtils.findElement(this.node, TERMINALS_CLASS);
    let termList = DOMUtils.findElement(termSection, LIST_CLASS);
    let sessionSection = DOMUtils.findElement(this.node, SESSIONS_CLASS);
    let sessionList = DOMUtils.findElement(sessionSection, LIST_CLASS);
    let refresh = DOMUtils.findElement(this.node, REFRESH_CLASS);
    let shutdownTerms = DOMUtils.findElement(
      this.node,
      SHUTDOWN_TERMINALS_CLASS
    );
    let shutdownSessions = DOMUtils.findElement(
      this.node,
      SHUTDOWN_SESSIONS_CLASS
    );
    let renderer = this._renderer;
    let clientX = event.clientX;
    let clientY = event.clientY;

    // Check for a refresh.
    if (ElementExt.hitTest(refresh, clientX, clientY)) {
      this.refresh();
      return;
    }

    // Check for terminals shutdown.
    // Terminals might be disabled, check node exist first.
    if (shutdownTerms && ElementExt.hitTest(shutdownTerms, clientX, clientY)) {

protected onUpdateRequest(msg: Message): void {
    // Fetch common variables.
    let termSection = DOMUtils.findElement(this.node, TERMINALS_CLASS);
    let termList = DOMUtils.findElement(termSection, LIST_CLASS) as HTMLElement;
    let sessionSection = DOMUtils.findElement(this.node, SESSIONS_CLASS);
    let sessionList = DOMUtils.findElement(
      sessionSection,
      LIST_CLASS
    ) as HTMLLIElement;
    let renderer = this._renderer;
    let specs = this._manager.specs;

    // Create a dummy div if terminals are not available.
    termList = termList || document.createElement('div');

    // Remove any excess item nodes.
    while (termList.children.length > this._runningTerminals.length) {
      termList.removeChild(termList.firstChild!);
    }
    while (sessionList.children.length > this._runningSessions.length) {
      sessionList.removeChild(sessionList.firstChild!);
    }

updateItemNode(
      node: HTMLElement,
      model: Contents.IModel,
      fileType?: DocumentRegistry.IFileType
    ): void {
      let icon = DOMUtils.findElement(node, ITEM_ICON_CLASS);
      let text = DOMUtils.findElement(node, ITEM_TEXT_CLASS);
      let modified = DOMUtils.findElement(node, ITEM_MODIFIED_CLASS);

      if (fileType) {
        // TODO: remove workaround if...else/code in else clause in v2.0.0
        // workaround for 1.0.x versions of Jlab pulling in 1.1.x versions of filebrowser
        if (this._iconRegistry) {
          // add icon as svg node. Can be styled using CSS
          this._iconRegistry.icon({
            name: fileType.iconClass,
            className: ITEM_ICON_CLASS,
            title: fileType.iconLabel,
            fallback: true,
            container: icon,
            center: true,
            kind: 'listing'
          });
        } else {

private _evtDragLeave(event: IDragEvent): void {
    event.preventDefault();
    event.stopPropagation();
    let dropTarget = DOMUtils.findElement(this.node, DROP_TARGET_CLASS);
    if (dropTarget) {
      dropTarget.classList.remove(DROP_TARGET_CLASS);
    }
  }

private _evtDragOver(event: IDragEvent): void {
    event.preventDefault();
    event.stopPropagation();
    event.dropAction = event.proposedAction;
    let dropTarget = DOMUtils.findElement(this.node, DROP_TARGET_CLASS);
    if (dropTarget) {
      dropTarget.classList.remove(DROP_TARGET_CLASS);
    }
    let index = ArrayExt.findFirstIndex(this._crumbs, node =>
      ElementExt.hitTest(node, event.clientX, event.clientY)
    );
    if (index !== -1) {
      this._crumbs[index].classList.add(DROP_TARGET_CLASS);
    }
  }

createDragImage(
      node: HTMLElement,
      count: number,
      fileType?: DocumentRegistry.IFileType
    ): HTMLElement {
      let dragImage = node.cloneNode(true) as HTMLElement;
      let modified = DOMUtils.findElement(dragImage, ITEM_MODIFIED_CLASS);
      let icon = DOMUtils.findElement(dragImage, ITEM_ICON_CLASS);
      dragImage.removeChild(modified as HTMLElement);

      if (!fileType) {
        icon.textContent = '';
        icon.className = '';
      } else {
        icon.textContent = fileType.iconLabel || '';
        icon.className = fileType.iconClass || '';
      }
      icon.classList.add(DRAG_ICON_CLASS);

      if (count > 1) {
        let nameNode = DOMUtils.findElement(dragImage, ITEM_TEXT_CLASS);
        nameNode.textContent = count + ' Items';
      }

protected onAfterAttach(msg: Message): void {
    super.onAfterAttach(msg);
    let node = this.node;
    let content = DOMUtils.findElement(node, CONTENT_CLASS);
    node.addEventListener('mousedown', this);
    node.addEventListener('keydown', this);
    node.addEventListener('click', this);
    node.addEventListener('dblclick', this);
    content.addEventListener('dragenter', this);
    content.addEventListener('dragover', this);
    content.addEventListener('dragleave', this);
    content.addEventListener('dragend', this);
    content.addEventListener('drop', this);
    content.addEventListener('scroll', this);
    content.addEventListener('p-dragenter', this);
    content.addEventListener('p-dragleave', this);
    content.addEventListener('p-dragover', this);
    content.addEventListener('p-drop', this);
  }