_onRequestToAddFormElement(ev) {
      const child = ev.detail.element;
      if (child === this) {
        // as we fire and listen - don't add ourselves
        return;
      }
      if (this.isRegisteredFormElement(child)) {
        // do not readd already existing elements
        return;
      }
      ev.stopPropagation();

      // Check for DOM order to determine the right order to insert into formElements
      // If there is no other element, index is -1 (e.g. add it to the end)
      let indexToInsertAt = -1;
      if (this.formElements && Array.isArray(this.formElements)) {
        // we start comparing from the end of the array as it's the most likely position where the element will be added
        for (const [i, formElement] of this.formElements.entries()) {
          // compareDocumentPosition returns a bitmask
          // eslint-disable-next-line no-bitwise
          if (formElement.compareDocumentPosition(child) & Node.DOCUMENT_POSITION_FOLLOWING) {
            // nothing as child is after formElement in DOM
          } else {
            // first time child is NOT after formElement in DOM we insert it
            indexToInsertAt = i;
            break;
          }
        }
      }
      this.addFormElement(child, indexToInsertAt);
    }
Hook for Subclassers to perform logic before an element is added
@param {CustomEvent} ev
@protected