bug: (external) angular domino returns undefined instead of null for querySelector

Prerequisites

I have read the Contributing Guidelines.
I agree to follow the Code of Conduct.
I have searched for existing issues that already report this problem, without success.

Ionic Framework Version

v7.x

Current Behavior

I recently upgraded my Ionic application first from 5.x to 6.x and after that from 6.x to 7.x
I followed all the upgrade steps, described on the website and everything seems to work as it should.

However, when loading the page I get a long error message in the developer console of Visual studio code.

The problem is, I dont have any helper slot in my code.

So far I didn't find any solution to the problem. I would expect to find at least something about the warning in the docs.
`

        [Ionic Warning]: The "helper" slot has been deprecated in favor of using the "helperText" property on ion-input or ion-textarea. <ref *4> HTMLUnknownElement {
        parentNode: <ref *2> HTMLDivElement {
          parentNode: <ref *1> HTMLUnknownElement {
          parentNode: [HTMLUnknownElement],
          _previousSibling: [Circular *1],
          _nextSibling: [Circular *1],
          _index: undefined,
          _childNodes: [NodeList],
          _firstChild: null,
          nodeType: 1,
          ownerDocument: [Object],
          localName: 'ion-card',
          namespaceURI: 'http://www.w3.org/1999/xhtml',
          prefix: null,
          _tagName: 'ION-CARD',
          _attrsByQName: [Object: null prototype],
          _attrsByLName: [Object: null prototype],
          _attrKeys: [Array],
          __ngContext__: 444,
          _listeners: [Object: null prototype],
          _nid: 3034,
          _classList: [DOMTokenList],
          connectedCallback: [Function: h],
          's-p': [],
          's-rc': undefined,
          componentOnReady: [Function: componentOnReady$1],
          forceUpdate: [Function: forceUpdate],
          shadowRoot: [Circular *1],
          color: [Getter/Setter],
          button: [Getter/Setter],
          type: [Getter/Setter],
          disabled: [Getter/Setter],
          download: [Getter/Setter],
          href: [Getter/Setter],
          rel: [Getter/Setter],
          routerDirection: [Getter/Setter],
          routerAnimation: [Getter/Setter],
          target: [Getter/Setter],
          _lastModTime: 828,
          _children: [Object],
          's-cr': [Object],
          's-sc': 'sc-ion-card-md',
          's-en': ''
        },
        _previousSibling: <ref *3> HTMLUnknownElement {
          parentNode: [HTMLUnknownElement],
          _previousSibling: [Object],
          _nextSibling: [Circular *2],
          _index: 5,
          _childNodes: [NodeList],
          _firstChild: null,
          nodeType: 1,
          ownerDocument: [Object],
          localName: 'ion-fab',
          namespaceURI: 'http://www.w3.org/1999/xhtml',
          prefix: null,
          _tagName: 'ION-FAB',
          _attrsByQName: [Object: null prototype],
          _attrsByLName: [Object: null prototype],
          _attrKeys: [Array],
          __ngContext__: 444,
          _listeners: [Object: null prototype],
          _nid: 3269,
          connectedCallback: [Function: h],
          's-p': [],
          's-rc': undefined,
          componentOnReady: [Function: componentOnReady$1],
          forceUpdate: [Function: forceUpdate],
          shadowRoot: [Circular *3],
          horizontal: [Getter/Setter],
          vertical: [Getter/Setter],
          edge: [Getter/Setter],
          activated: [Getter/Setter],
          _lastModTime: 827,
          _children: [Object],
          's-cr': [Object],
          's-sn': '',
          's-ol': [Object],
          's-hn': 'ION-CARD',
          's-sc': 'sc-ion-fab',
          _classList: [DOMTokenList],
          's-en': ''
        },
        _nextSibling: {
          parentNode: [HTMLUnknownElement],
          _previousSibling: [Circular *2],
          _nextSibling: [Object],
          _index: 0,
          nodeType: 8,
          ownerDocument: [Object],
          _data: '',
          's-cn': true,
          _nid: 3035
        },
        _index: 6,
        _childNodes: NodeList(2) [ [Circular *4], [HTMLUnknownElement] ],
        _firstChild: null,
        nodeType: 1,
        ownerDocument: <ref *5> {
          parentNode: null,
          _previousSibling: [Circular *5],
          _nextSibling: [Circular *5],
          _index: undefined,
          _childNodes: null,
          _firstChild: [Object],
          nodeType: 9,
          isHTML: true,
          _address: 'http://localhost:58476/',
          readyState: 'loading',
          implementation: [Object],
          ownerDocument: null,
          _contentType: 'text/html',
          doctype: [Object],
          documentElement: [HTMLHtmlElement],
          _templateDocCache: null,
          _nodeIterators: null,
          _nid: 1,
          _nextnid: 3659,
          _nodes: [Array],
          byId: [Object: null prototype],
          modclock: 828,
          _scripting_enabled: true,
          defaultView: [Object],
          _lastModTime: 1,
          _listeners: [Object: null prototype],
          createElement: [Function: t],
          createElementNS: [Function: t]
        },
        localName: 'div',
        namespaceURI: 'http://www.w3.org/1999/xhtml',
        prefix: null,
        _tagName: 'DIV',
        _attrsByQName: [Object: null prototype] {
          '_ngcontent-sc108': [Object],
          class: [Object]
        },
        _attrsByLName: [Object: null prototype] {
          '|_ngcontent-sc108': [Object],
          '|class': [Object]
        },
        _attrKeys: [ '|_ngcontent-sc108', '|class' ],
        __ngContext__: 444,
        _nid: 3240,
        _lastModTime: 828,
        _children: {
          '0': [Circular *4],
          '1': [HTMLUnknownElement],
          element: [Circular *2],
          lastModTime: 175,
          childrenByNumber: [Array],
          childrenByName: [Object: null prototype] {}
        },
        's-sn': '',
        's-ol': {
          parentNode: [HTMLUnknownElement],
          _previousSibling: [Object],
          _nextSibling: [Object],
          _index: 3,
          nodeType: 8,
          ownerDocument: [Object],
          _data: 'org-location for <div> (host=undefined)',
          's-nr': [Circular *2],
          _nid: 3237
        },
        's-hn': 'ION-CARD'
      },
        _previousSibling: <ref *6> HTMLUnknownElement {
        parentNode: <ref *2> HTMLDivElement {
          parentNode: [HTMLUnknownElement],
          _previousSibling: [HTMLUnknownElement],
          _nextSibling: [Object],
          _index: 6,
          _childNodes: [NodeList],
          _firstChild: null,
          nodeType: 1,
          ownerDocument: [Object],
          localName: 'div',
          namespaceURI: 'http://www.w3.org/1999/xhtml',
          prefix: null,
          _tagName: 'DIV',
          _attrsByQName: [Object: null prototype],
          _attrsByLName: [Object: null prototype],
          _attrKeys: [Array],
          __ngContext__: 444,
          _nid: 3240,
          _lastModTime: 828,
          _children: [Object],
          's-sn': '',
          's-ol': [Object],
          's-hn': 'ION-CARD'
        },
        _previousSibling: [Circular *4],
        _nextSibling: [Circular *4],
        _index: undefined,
        _childNodes: NodeList(6) [
          [Object],
          [Object],
          [Object],
          [Object],
          [HTMLDivElement],
          [HTMLDivElement]
        ],
        _firstChild: null,
        nodeType: 1,
        ownerDocument: <ref *5> {
          parentNode: null,
          _previousSibling: [Circular *5],
          _nextSibling: [Circular *5],
          _index: undefined,
          _childNodes: null,
          _firstChild: [Object],
          nodeType: 9,
          isHTML: true,
          _address: 'http://localhost:58476/',
          readyState: 'loading',
          implementation: [Object],
          ownerDocument: null,
          _contentType: 'text/html',
          doctype: [Object],
          documentElement: [HTMLHtmlElement],
          _templateDocCache: null,
          _nodeIterators: null,
          _nid: 1,
          _nextnid: 3659,
          _nodes: [Array],
          byId: [Object: null prototype],
          modclock: 828,
          _scripting_enabled: true,
          defaultView: [Object],
          _lastModTime: 1,
          _listeners: [Object: null prototype],
          createElement: [Function: t],
          createElementNS: [Function: t]
        },
        localName: 'ion-item',
        namespaceURI: 'http://www.w3.org/1999/xhtml',
        prefix: null,
        _tagName: 'ION-ITEM',
        _attrsByQName: [Object: null prototype] {
          '_ngcontent-sc108': [Object],
          lines: [Object],
          class: [Object],
          's-mode': [Object]
        },
        _attrsByLName: [Object: null prototype] {
          '|_ngcontent-sc108': [Object],
          '|lines': [Object],
          '|class': [Object],
          '|s-mode': [Object]
        },
        _attrKeys: [ '|_ngcontent-sc108', '|lines', '|class', '|s-mode' ],
        __ngContext__: 444,
        _nid: 3249,
        connectedCallback: [Function: h],
        's-p': [],
        's-rc': undefined,
        _listeners: [Object: null prototype] {
          ionInput: [Array],
          ionColor: [Array],
          ionStyle: [Array]
        },
        componentOnReady: [Function: componentOnReady$1],
        forceUpdate: [Function: forceUpdate],
        shadowRoot: [Circular *6],
        color: [Getter/Setter],
        button: [Getter/Setter],
        detail: [Getter/Setter],
        detailIcon: [Getter/Setter],
        disabled: [Getter/Setter],
        download: [Getter/Setter],
        fill: [Getter/Setter],
        shape: [Getter/Setter],
        href: [Getter/Setter],
        rel: [Getter/Setter],
        lines: [Getter/Setter],
        counter: [Getter/Setter],
        routerAnimation: [Getter/Setter],
        routerDirection: [Getter/Setter],
        target: [Getter/Setter],
        type: [Getter/Setter],
        counterFormatter: [Getter/Setter],
        _lastModTime: 740,
        _children: {
          '0': [HTMLDivElement],
          '1': [HTMLDivElement],
          '2': undefined,
          element: [Circular *6],
          lastModTime: 740,
          childrenByNumber: [Array],
          childrenByName: [Object: null prototype] {}
        },
        's-cr': {
          parentNode: [Circular *6],
          _previousSibling: [HTMLDivElement],
          _nextSibling: [Object],
          _index: 0,
          nodeType: 8,
          ownerDocument: [Object],
          _data: '',
          's-cn': true,
          _nid: 3250
        },
        _classList: DOMTokenList {
          '0': 'card-info',
          '1': 'item-has-start-slot',
          '2': 'sc-ion-item-md-h',
          '3': 'item',
          '4': 'md',
          '5': 'item-lines-none',
          '6': 'item-fill-none',
          '7': 'ion-focusable',
          '8': 'hydrated',
          _getString: [Function (anonymous)],
          _setString: [Function (anonymous)],
          _length: 9,
          _lastStringValue: 'card-info item-has-start-slot sc-ion-item-md-h item md item-lines-none item-fill-none ion-focusable hydrated'
        },
        's-sc': 'sc-ion-item-md',
        's-en': ''
        },
        _nextSibling: <ref *6> HTMLUnknownElement {
        parentNode: <ref *2> HTMLDivElement {
          parentNode: [HTMLUnknownElement],
          _previousSibling: [HTMLUnknownElement],
          _nextSibling: [Object],
          _index: 6,
          _childNodes: [NodeList],
          _firstChild: null,
          nodeType: 1,
          ownerDocument: [Object],
          localName: 'div',
          namespaceURI: 'http://www.w3.org/1999/xhtml',
          prefix: null,
          _tagName: 'DIV',
          _attrsByQName: [Object: null prototype],
          _attrsByLName: [Object: null prototype],
          _attrKeys: [Array],
          __ngContext__: 444,
          _nid: 3240,
          _lastModTime: 828,
          _children: [Object],
          's-sn': '',
          's-ol': [Object],
          's-hn': 'ION-CARD'
        },
        _previousSibling: [Circular *4],
        _nextSibling: [Circular *4],
        _index: undefined,
        _childNodes: NodeList(6) [
          [Object],
          [Object],
          [Object],
          [Object],
          [HTMLDivElement],
          [HTMLDivElement]
        ],
        _firstChild: null,
        nodeType: 1,
        ownerDocument: <ref *5> {
          parentNode: null,
          _previousSibling: [Circular *5],
          _nextSibling: [Circular *5],
          _index: undefined,
          _childNodes: null,
          _firstChild: [Object],
          nodeType: 9,
          isHTML: true,
          _address: 'http://localhost:58476/',
          readyState: 'loading',
          implementation: [Object],
          ownerDocument: null,
          _contentType: 'text/html',
          doctype: [Object],
          documentElement: [HTMLHtmlElement],
          _templateDocCache: null,
          _nodeIterators: null,
          _nid: 1,
          _nextnid: 3659,
          _nodes: [Array],
          byId: [Object: null prototype],
          modclock: 828,
          _scripting_enabled: true,
          defaultView: [Object],
          _lastModTime: 1,
          _listeners: [Object: null prototype],
          createElement: [Function: t],
          createElementNS: [Function: t]
        },
        localName: 'ion-item',
        namespaceURI: 'http://www.w3.org/1999/xhtml',
        prefix: null,
        _tagName: 'ION-ITEM',
        _attrsByQName: [Object: null prototype] {
          '_ngcontent-sc108': [Object],
          lines: [Object],
          class: [Object],
          's-mode': [Object]
        },
        _attrsByLName: [Object: null prototype] {
          '|_ngcontent-sc108': [Object],
          '|lines': [Object],
          '|class': [Object],
          '|s-mode': [Object]
        },
        _attrKeys: [ '|_ngcontent-sc108', '|lines', '|class', '|s-mode' ],
        __ngContext__: 444,
        _nid: 3249,
        connectedCallback: [Function: h],
        's-p': [],
        's-rc': undefined,
        _listeners: [Object: null prototype] {
          ionInput: [Array],
          ionColor: [Array],
          ionStyle: [Array]
        },
        componentOnReady: [Function: componentOnReady$1],
        forceUpdate: [Function: forceUpdate],
        shadowRoot: [Circular *6],
        color: [Getter/Setter],
        button: [Getter/Setter],
        detail: [Getter/Setter],
        detailIcon: [Getter/Setter],
        disabled: [Getter/Setter],
        download: [Getter/Setter],
        fill: [Getter/Setter],
        shape: [Getter/Setter],
        href: [Getter/Setter],
        rel: [Getter/Setter],
        lines: [Getter/Setter],
        counter: [Getter/Setter],
        routerAnimation: [Getter/Setter],
        routerDirection: [Getter/Setter],
        target: [Getter/Setter],
        type: [Getter/Setter],
        counterFormatter: [Getter/Setter],
        _lastModTime: 740,
        _children: {
          '0': [HTMLDivElement],
          '1': [HTMLDivElement],
          '2': undefined,
          element: [Circular *6],
          lastModTime: 740,
          childrenByNumber: [Array],
          childrenByName: [Object: null prototype] {}
        },
        's-cr': {
          parentNode: [Circular *6],
          _previousSibling: [HTMLDivElement],
          _nextSibling: [Object],
          _index: 0,
          nodeType: 8,
          ownerDocument: [Object],
          _data: '',
          's-cn': true,
          _nid: 3250
        },
        _classList: DOMTokenList {
          '0': 'card-info',
          '1': 'item-has-start-slot',
          '2': 'sc-ion-item-md-h',
          '3': 'item',
          '4': 'md',
          '5': 'item-lines-none',
          '6': 'item-fill-none',
          '7': 'ion-focusable',
          '8': 'hydrated',
          _getString: [Function (anonymous)],
          _setString: [Function (anonymous)],
          _length: 9,
          _lastStringValue: 'card-info item-has-start-slot sc-ion-item-md-h item md item-lines-none item-fill-none ion-focusable hydrated'
        },
        's-sc': 'sc-ion-item-md',
        's-en': ''
      },
        _index: undefined,
        _childNodes: NodeList(4) [
        {
          parentNode: [Circular *4],
          _previousSibling: [HTMLDivElement],
          _nextSibling: [Object],
          _index: 0,
          nodeType: 8,
          ownerDocument: [Object],
          _data: '',
          's-cn': true,
          _nid: 3242
        },
        {
          parentNode: [Circular *4],
          _previousSibling: [Object],
          _nextSibling: [HTMLDivElement],
          _index: 1,
          nodeType: 8,
          ownerDocument: [Object],
          _data: 'org-location for <ion-label> (host=undefined)',
          's-nr': [HTMLUnknownElement],
          _nid: 3459
        },
        HTMLDivElement {
          parentNode: [Circular *4],
          _previousSibling: [Object],
          _nextSibling: [HTMLDivElement],
          _index: 3,
          _childNodes: [NodeList],
          _firstChild: null,
          nodeType: 1,
          ownerDocument: [Object],
          localName: 'div',
          namespaceURI: 'http://www.w3.org/1999/xhtml',
          prefix: null,
          _tagName: 'DIV',
          _attrsByQName: [Object: null prototype],
          _attrsByLName: [Object: null prototype],
          _attrKeys: [Array],
          _classList: [DOMTokenList],
          's-si': 'sc-ion-item-md',
          's-hn': 'ION-ITEM',
          _nid: 3448,
          _lastModTime: 828,
          _children: [Object]
        },
        HTMLDivElement {
          parentNode: [Circular *4],
          _previousSibling: [HTMLDivElement],
          _nextSibling: [Object],
          _index: 4,
          _childNodes: [NodeList],
          _firstChild: null,
          nodeType: 1,
          ownerDocument: [Object],
          localName: 'div',
          namespaceURI: 'http://www.w3.org/1999/xhtml',
          prefix: null,
          _tagName: 'DIV',
          _attrsByQName: [Object: null prototype],
          _attrsByLName: [Object: null prototype],
          _attrKeys: [Array],
          _classList: [DOMTokenList],
          's-si': 'sc-ion-item-md',
          's-hn': 'ION-ITEM',
          _nid: 3456,
          _lastModTime: 729,
          _children: [Object]
        }
        ],
        _firstChild: null,
      nodeType: 1,
      ownerDocument: <ref *5> {
        parentNode: null,
        _previousSibling: [Circular *5],
        _nextSibling: [Circular *5],
        _index: undefined,
        _childNodes: null,
        _firstChild: {
          parentNode: [Circular *5],
          _previousSibling: [HTMLHtmlElement],
          _nextSibling: [HTMLHtmlElement],
          _index: undefined,
          nodeType: 10,
          ownerDocument: [Circular *5],
          name: 'html',
          publicId: '',
          systemId: '',
          _nid: 2
        },
        nodeType: 9,
        isHTML: true,
        _address: 'http://localhost:58476/',
        readyState: 'loading',
        implementation: { contextObject: [Circular *5] },
        ownerDocument: null,
        _contentType: 'text/html',
        doctype: {
          parentNode: [Circular *5],
          _previousSibling: [HTMLHtmlElement],
          _nextSibling: [HTMLHtmlElement],
          _index: undefined,
          nodeType: 10,
          ownerDocument: [Circular *5],
          name: 'html',
          publicId: '',
          systemId: '',
          _nid: 2
        },
        documentElement: HTMLHtmlElement {
          parentNode: [Circular *5],
          _previousSibling: [Object],
          _nextSibling: [Object],
          _index: undefined,
          _childNodes: null,
          _firstChild: [HTMLHeadElement],
          nodeType: 1,
          ownerDocument: [Circular *5],
          localName: 'html',
          namespaceURI: 'http://www.w3.org/1999/xhtml',
          prefix: null,
          _tagName: 'HTML',
          _attrsByQName: [Object: null prototype],
          _attrsByLName: [Object: null prototype],
          _attrKeys: [Array],
          _nid: 3,
          _classList: [DOMTokenList]
        },
        _templateDocCache: null,
        _nodeIterators: null,
        _nid: 1,
        _nextnid: 3659,
        _nodes: [
          null,                 [Circular *5],        [Object],
          [HTMLHtmlElement],    [HTMLHeadElement],    [HTMLLinkElement],
          [Object],             [HTMLMetaElement],    [Object],
          [HTMLTitleElement],   undefined,            [Object],
          [HTMLBaseElement],    [Object],             [HTMLMetaElement],
          [Object],             [HTMLMetaElement],    [Object],
          [HTMLMetaElement],    [Object],             [HTMLMetaElement],
          [Object],             [HTMLLinkElement],    [Object],
          [HTMLStyleElement],   [Object],             [Object],
          [HTMLLinkElement],    [Object],             [Object],
          [Object],             [HTMLMetaElement],    [Object],
          [HTMLMetaElement],    [Object],             [HTMLStyleElement],
          [Object],             [HTMLLinkElement],    [Object],
          [HTMLBodyElement],    [Object],             [HTMLUnknownElement],
          [Object],             [HTMLScriptElement],  [HTMLScriptElement],
          [HTMLScriptElement],  [HTMLScriptElement],  [Object],
          [HTMLStyleElement],   [Object],             [HTMLUnknownElement],
          [HTMLUnknownElement], [HTMLUnknownElement], [Object],
          [Object],             undefined,            undefined,
          undefined,            undefined,            undefined,
          undefined,            undefined,            undefined,
          undefined,            undefined,            undefined,
          undefined,            undefined,            undefined,
          undefined,            undefined,            undefined,
          undefined,            undefined,            undefined,
          undefined,            undefined,            undefined,
          undefined,            undefined,            undefined,
          undefined,            undefined,            undefined,
          undefined,            undefined,            [HTMLUnknownElement],
          [HTMLStyleElement],   [Object],             [HTMLStyleElement],
          [Object],             undefined,            undefined,
          undefined,            undefined,            undefined,
          undefined,            [Object],             [HTMLMetaElement],
          [HTMLMetaElement],
          ... 3559 more items
        ],
        byId: [Object: null prototype] {
          main: [HTMLUnknownElement],
          _id: [HTMLInputElement],
          'serverApp-state': [HTMLScriptElement],
          'background-content': [MultiId],
          'ion-sel-0-lbl': [HTMLLabelElement],
          'ion-sel-0': [HTMLButtonElement],
          'ion-selopt-0': [HTMLUnknownElement],
          'ion-selopt-1': [HTMLUnknownElement],
          'ion-selopt-2': [HTMLUnknownElement],
          'ion-selopt-3': [HTMLUnknownElement],
          'ion-selopt-4': [HTMLUnknownElement],
          'ion-selopt-5': [HTMLUnknownElement],
          'ion-selopt-6': [HTMLUnknownElement],
          'ion-selopt-7': [HTMLUnknownElement],
          'ion-selopt-8': [HTMLUnknownElement],
          'ion-selopt-9': [HTMLUnknownElement]
        },
        modclock: 828,
        _scripting_enabled: true,
        defaultView: {
          document: [Circular *5],
          location: [Location],
          _listeners: [Object: null prototype],
          alert: [Function: bound alert],
          blur: [Function: bound blur],
          cancelAnimationFrame: [Function: bound cancelAnimationFrame],
          cancelIdleCallback: [Function: bound cancelIdleCallback],
          close: [Function: bound close],
          confirm: [Function: bound confirm],
          focus: [Function: bound focus],
          matchMedia: [Function: bound matchMedia],
          open: [Function: bound open],
          prompt: [Function: bound prompt],
          requestAnimationFrame: [Function: bound requestAnimationFrame],
          requestIdleCallback: [Function: bound requestIdleCallback],
          URL: [Function: bound URL],
          customElements: null,
          __allowInterval: false,
          __maxTimeout: 0,
          fetch: [Function (anonymous)],
          FetchError: [class FetchError],
          Headers: [class Headers],
          Request: [class Request],
          Response: [class Response],
          Ionic: [Object]
        },
        _lastModTime: 1,
        _listeners: [Object: null prototype] {
          pause: [Array],
          resume: [Array],
          ionBackButton: [Array],
          keydown: [Array]
        },
        createElement: [Function: t],
        createElementNS: [Function: t]
        },
        localName: 'ion-item',
        namespaceURI: 'http://www.w3.org/1999/xhtml',
        prefix: null,
        _tagName: 'ION-ITEM',
        _attrsByQName: [Object: null prototype] {
        '_ngcontent-sc108': {
          localName: '_ngcontent-sc108',
          prefix: null,
          namespaceURI: null,
          data: '',
          _ownerElement: [Circular *4],
          onchange: undefined
        },
        lines: {
          localName: 'lines',
          prefix: null,
          namespaceURI: null,
          data: 'none',
          _ownerElement: [Circular *4],
          onchange: undefined
        },
        class: {
          localName: 'class',
          prefix: null,
          namespaceURI: null,
          data: 'location item-has-start-slot sc-ion-item-md-h item md item-lines-none item-fill-none ion-focusable hydrated',
          _ownerElement: [Circular *4],
          onchange: [Function (anonymous)]
        },
        's-mode': {
          localName: 's-mode',
          prefix: null,
          namespaceURI: null,
          data: 'md',
          _ownerElement: [Circular *4],
          onchange: undefined
        }
        },
        _attrsByLName: [Object: null prototype] {
        '|_ngcontent-sc108': {
          localName: '_ngcontent-sc108',
          prefix: null,
          namespaceURI: null,
          data: '',
          _ownerElement: [Circular *4],
          onchange: undefined
        },
        '|lines': {
          localName: 'lines',
          prefix: null,
          namespaceURI: null,
          data: 'none',
          _ownerElement: [Circular *4],
          onchange: undefined
        },
        '|class': {
          localName: 'class',
          prefix: null,
          namespaceURI: null,
          data: 'location item-has-start-slot sc-ion-item-md-h item md item-lines-none item-fill-none ion-focusable hydrated',
          _ownerElement: [Circular *4],
          onchange: [Function (anonymous)]
        },
        '|s-mode': {
          localName: 's-mode',
          prefix: null,
          namespaceURI: null,
          data: 'md',
          _ownerElement: [Circular *4],
          onchange: undefined
        }
        },
        _attrKeys: [ '|_ngcontent-sc108', '|lines', '|class', '|s-mode' ],
        __ngContext__: 444,
        _nid: 3241,
        connectedCallback: [Function: h],
        's-p': [],
        's-rc': undefined,
        _listeners: [Object: null prototype] {
        ionInput: [ [Object] ],
        ionColor: [ [Object] ],
        ionStyle: [ [Object] ]
        },
        componentOnReady: [Function: componentOnReady$1],
        forceUpdate: [Function: forceUpdate],
        shadowRoot: [Circular *4],
        color: [Getter/Setter],
        button: [Getter/Setter],
        detail: [Getter/Setter],
        detailIcon: [Getter/Setter],
        disabled: [Getter/Setter],
        download: [Getter/Setter],
        fill: [Getter/Setter],
        shape: [Getter/Setter],
        href: [Getter/Setter],
        rel: [Getter/Setter],
        lines: [Getter/Setter],
        counter: [Getter/Setter],
        routerAnimation: [Getter/Setter],
        routerDirection: [Getter/Setter],
        target: [Getter/Setter],
        type: [Getter/Setter],
        counterFormatter: [Getter/Setter],
        _lastModTime: 828,
        _children: {
        '0': HTMLDivElement {
          parentNode: [Circular *4],
          _previousSibling: [Object],
          _nextSibling: [HTMLDivElement],
          _index: 3,
          _childNodes: [NodeList],
          _firstChild: null,
          nodeType: 1,
          ownerDocument: [Object],
          localName: 'div',
          namespaceURI: 'http://www.w3.org/1999/xhtml',
          prefix: null,
          _tagName: 'DIV',
          _attrsByQName: [Object: null prototype],
          _attrsByLName: [Object: null prototype],
          _attrKeys: [Array],
          _classList: [DOMTokenList],
          's-si': 'sc-ion-item-md',
          's-hn': 'ION-ITEM',
          _nid: 3448,
          _lastModTime: 828,
          _children: [Object]
          },
        '1': HTMLDivElement {
          parentNode: [Circular *4],
          _previousSibling: [HTMLDivElement],
          _nextSibling: [Object],
          _index: 4,
          _childNodes: [NodeList],
          _firstChild: null,
          nodeType: 1,
          ownerDocument: [Object],
          localName: 'div',
          namespaceURI: 'http://www.w3.org/1999/xhtml',
          prefix: null,
          _tagName: 'DIV',
          _attrsByQName: [Object: null prototype],
          _attrsByLName: [Object: null prototype],
          _attrKeys: [Array],
          _classList: [DOMTokenList],
          's-si': 'sc-ion-item-md',
          's-hn': 'ION-ITEM',
          _nid: 3456,
          _lastModTime: 729,
          _children: [Object]
        },
          element: [Circular *4],
          lastModTime: 729,
          childrenByNumber: [ [HTMLDivElement], [HTMLDivElement] ],
          childrenByName: [Object: null prototype] {}
        },
          's-cr': <ref *7> {
          parentNode: [Circular *4],
        _previousSibling: HTMLDivElement {
          parentNode: [Circular *4],
          _previousSibling: [HTMLDivElement],
          _nextSibling: [Circular *7],
          _index: 4,
          _childNodes: [NodeList],
          _firstChild: null,
          nodeType: 1,
          ownerDocument: [Object],
          localName: 'div',
          namespaceURI: 'http://www.w3.org/1999/xhtml',
          prefix: null,
          _tagName: 'DIV',
          _attrsByQName: [Object: null prototype],
          _attrsByLName: [Object: null prototype],
          _attrKeys: [Array],
          _classList: [DOMTokenList],
          's-si': 'sc-ion-item-md',
          's-hn': 'ION-ITEM',
          _nid: 3456,
          _lastModTime: 729,
          _children: [Object]
        },
        _nextSibling: {
          parentNode: [Circular *4],
          _previousSibling: [Circular *7],
          _nextSibling: [HTMLDivElement],
          _index: 1,
          nodeType: 8,
          ownerDocument: [Object],
          _data: 'org-location for <ion-label> (host=undefined)',
          's-nr': [HTMLUnknownElement],
          _nid: 3459
        },
        _index: 0,
        nodeType: 8,
        ownerDocument: <ref *5> {
          parentNode: null,
          _previousSibling: [Circular *5],
          _nextSibling: [Circular *5],
          _index: undefined,
          _childNodes: null,
          _firstChild: [Object],
          nodeType: 9,
          isHTML: true,
          _address: 'http://localhost:58476/',
          readyState: 'loading',
          implementation: [Object],
          ownerDocument: null,
          _contentType: 'text/html',
          doctype: [Object],
          documentElement: [HTMLHtmlElement],
          _templateDocCache: null,
          _nodeIterators: null,
          _nid: 1,
          _nextnid: 3659,
          _nodes: [Array],
          byId: [Object: null prototype],
          modclock: 828,
          _scripting_enabled: true,
          defaultView: [Object],
          _lastModTime: 1,
          _listeners: [Object: null prototype],
          createElement: [Function: t],
          createElementNS: [Function: t]
        },
        _data: '',
        's-cn': true,
        _nid: 3242
        },
        _classList: DOMTokenList {
        '0': 'location',
        '1': 'item-has-start-slot',
        '2': 'sc-ion-item-md-h',
        '3': 'item',
        '4': 'md',
        '5': 'item-lines-none',
        '6': 'item-fill-none',
        '7': 'ion-focusable',
        '8': 'hydrated',
        _getString: [Function (anonymous)],
        _setString: [Function (anonymous)],
        _length: 9,
        _lastStringValue: 'location item-has-start-slot sc-ion-item-md-h item md item-lines-none item-fill-none ion-focusable hydrated'
        },
        's-sc': 'sc-ion-item-md',
        's-en': ''
        }

`

Expected Behavior

No error/warning messages in the console.

Steps to Reproduce

I am running a server side rendered version:
"serve:ssr": "node dist/app/server/main.js",

Code Reproduction URL

No response

Ionic Info

`

   ionic info
   [WARN] Error loading @ionic/angular package.json: Error
   [ERR_PACKAGE_PATH_NOT_EXPORTED]: Package subpath './package' is not
   defined by "exports" in
   E:\xxxxxxx\node_modules\@ionic\angular\package.json

   Ionic:

   Ionic CLI                     : 6.12.3 (C:\Users\alex\AppData\Roaming\npm\node_modules\@ionic\cli)
   Ionic Framework               : not installed
   @angular-devkit/build-angular : 15.2.8
   @angular-devkit/schematics    : 15.2.8
   @angular/cli                  : 15.2.8
   @ionic/angular-toolkit        : 9.0.0

   Capacitor:

   Capacitor CLI   : 2.4.5
   @capacitor/core : 2.4.5

   Utility:

   cordova-res : not installed
   native-run  : not installed

   System:

   NodeJS : v16.18.0 (C:\Program Files\nodejs\node.exe)
   npm    : 6.11.3
   OS     : Windows 10

`

Angular: ng version
`

   Package                         Version
   ---------------------------------------------------------       
   @angular-devkit/architect       0.1502.8
   @angular-devkit/build-angular   15.2.8
   @angular-devkit/core            15.2.8
   @angular-devkit/schematics      15.2.8
   @angular/cli                    15.2.8
   @nguniversal/builders           15.2.1
   @nguniversal/express-engine     15.2.1
   @schematics/angular             15.2.8
   rxjs                            7.5.0
   typescript                      4.9.5

`

package json:
`

   "@angular/animations": "15.2.9",
   "@angular/common": "^15.2.9",
   "@angular/core": "^15.2.9",
   "@angular/forms": "^15.2.9",
   "@angular/platform-browser": "^15.2.9",
   "@angular/platform-browser-dynamic": "^15.2.9",
   "@angular/platform-server": "15.2.9",
   "@angular/router": "^15.2.9",
   "@capacitor/core": "2.4.5",
   "@ionic-native/core": "^5.0.0",
   "@ionic-native/splash-screen": "^5.0.0",
   "@ionic-native/status-bar": "^5.0.0",
   "@ionic/angular": "7.0.7",
   "@nguniversal/express-engine": "15.2.1",
   "@ionic/angular-server": "7.0.7",
   "@ionic/angular-toolkit": "9.0.0",
   "@nguniversal/builders": "15.2.1",

`

Additional Information

No response

From what I learned so far, the ion-label implementation for ion-input, ion-select and so on has changed in the recent versions. Didn't find that in the migration guides so far. I fixed all of the ion-label problems, but the error message is still there.

Thanks for the issue! This issue has been labeled as needs reproduction. This label is added to issues that need a code reproduction.

Please reproduce this issue in an Ionic starter application and provide a way for us to access it (GitHub repo, StackBlitz, etc). Without a reliable code reproduction, it is unlikely we will be able to resolve the issue, leading to it being closed.

If you have already provided a code snippet and are seeing this message, it is likely that the code snippet was not enough for our team to reproduce the issue.

For a guide on how to create a good reproduction, see our Contributing Guide.

@liamdebeasi

@liamdebeasi
From what I see in the source code, the helper and error slots are only inside commented out, generated code of my menu items. See last 3 lines.
Example:

<ion-menu-toggle
  _ngcontent-sc138=""
  class="sc-ion-menu-toggle-h md menu-toggle-hidden sc-ion-menu-toggle-s hydrated"
  aria-hidden="true"
  ><!----><!--org-location for <ion-item> (host=undefined)--><!--<slot> (host=ion-menu-toggle)--><ion-item
    _ngcontent-sc138=""
    menuclose=""
    tabindex="0"
    class="item-has-start-slot sc-ion-item-md-h item md item-lines-default item-fill-none in-list ion-activatable ion-focusable hydrated"
    s-mode="md"
    role="listitem"
    ><!----><!--org-location for <ion-icon> (host=undefined)--><!--org-location for <ion-label> (host=undefined)--><a
      href="/"
      class="item-native sc-ion-item-md sc-ion-item-md-s"
      part="native"
      ><!--<slot name="start"> (host=ion-item)--><ion-icon
        _ngcontent-sc138=""
        slot="start"
        name="home-outline"
        class="sc-ion-icon-h md hydrated"
        role="img"
        ><!---->
        <div class="icon-inner sc-ion-icon"></div
      ></ion-icon>
      <div class="item-inner sc-ion-item-md sc-ion-item-md-s">
        <div class="input-wrapper sc-ion-item-md sc-ion-item-md-s">
          <!--<slot> (host=ion-item)--><ion-label
            _ngcontent-sc138=""
            s-mode="md"
            class="sc-ion-label-md-h sc-ion-label-md-s md hydrated"
            ><!---->
            Home
          </ion-label>
        </div>
        <!--<slot name="end"> (host=ion-item)-->
        <div class="item-inner-highlight sc-ion-item-md"></div>
      </div>
      <ion-ripple-effect
        class="sc-ion-item-md sc-ion-ripple-effect-h md hydrated"
        role="presentation"
        ><!----></ion-ripple-effect
      >
      <div class="item-highlight sc-ion-item-md"></div
    ></a>
    <div class="item-bottom sc-ion-item-md sc-ion-item-md-s">
      <!--<slot name="error"> (host=ion-item)--><!--<slot name="helper"> (host=ion-item)-->
    </div></ion-item
  ></ion-menu-toggle
>

Original code that generates the above code:

        <ion-menu-toggle>
          <ion-item
            menuClose
            [routerLink]="['']"
            [queryParams]="{ l: languageParams }"
          >
            <ion-icon slot="start" name="home-outline"></ion-icon>
            <ion-label>
              {{ lang.home }}
            </ion-label>
          </ion-item>
        </ion-menu-toggle>

Note, we use Server side rendering in our application.

Also how can i show multiple error texts?

I previously had:

<ion-item fill="outline" >
     <ion-label position="stacked" color="warning">
       <ion-icon slot="start" name="person"></ion-icon>
         Enter Email
     </ion-label>
     
    <ion-input type="email" formControlName="email"></ion-input>
    
    <ng-container *ngIf="getLoginControl['email'].touched">
       <ion-note slot="error"
           *ngIf="(getLoginControl['email'].errors && getLoginControl['email'].errors['required'])">
          Email is required*
       </ion-note>
       
       <ion-note slot="error" *ngIf="(getLoginControl['email'].errors && getLoginControl['email'].invalid)">
         Email is Invalid*
       </ion-note>
    </ng-container>
 </ion-item>

Could you create a minimal reproduction app and post a link to it, such as a Github repo? Having a runnable example will help us determine the root cause of the issue. See the contributing guide for a how-to.

Could you create a minimal reproduction app and post a link to it, such as a Github repo? Having a runnable example will help us determine the root cause of the issue. See the contributing guide for a how-to.

@amandaejohnston
I don't think this is possible, since you need to build server side code and run a node process. How is this possible with web sandboxes?

You'll want to create a Github repo rather than use Stackblitz or another web sandbox. Just make sure it only has the code necessary to reproduce the issue.

I have the same problem using SSR any ion-item inside ion-menu will print warning messages in the console

@liamdebeasi

@liamdebeasi FWIW, I was able to reproduce this using https://github.com/mcornillon87/ionitem; @mcornillon87's instructions were slightly different different from what you tried.

For that rep, you need to:

Clone repo
Run npm install
Run npm run dev:ssr
Open app in the browser.

If I run npm run build:ssr && npm run serve:ssr, I instead get the error Error: NotYetImplemented, which also shouldn't be happening… not sure if it's related. If not I can open another issue for that error.

If that still doesn't reproduce, maybe it's environment related? I'm running macOS 13.4.1 (c) and node v16.18.1.

@b-chowdr

Thanks @b-chowdr! I can reproduce this now. The problem here is that we check for the existence of elements with attributes such as slot="helper" inside ion-item. We do this using a querySelector:

ionic-framework/core/src/components/item/item.tsx

Line 218 in 721fc6f

const hasHelperSlot = el.querySelector('[slot="helper"]') !== null;

querySelector should return null if the element is not found, but in this case it is (incorrectly) returning undefined. Since we do a strict !== null check, the hasHelperSlot condition is true, and the warning logs. I will see if I can identify why this is returning undefined.

The root issue is with Domino, a library that Angular uses internally. Domino polyfills Element.querySelector in SSR. However, it incorrectly returns undefined instead of null when an element is not found. Since Ionic uses strict null checks, the deprecation warning is incorrectly being logged.

I filed an issue with the Angular team: angular/angular#51068

@liamdebeasi

I'm also getting this issue. I've +1 the angular ticket as July 23 was the last update ref: angular/domino#16

@liamdebeasi is there a temporary workaround in the mean time to retract the console outputting thousands of lines?

fixed domino temporarily with patch-package localy. I don't believe it will ever be fixed for older versions of Angular anyways so I will close this.

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.

Navigation Menu

Repository navigation

bug: (external) angular domino returns undefined instead of null for querySelector #27564

Prerequisites

Ionic Framework Version

Current Behavior

Expected Behavior

Steps to Reproduce

Code Reproduction URL

Ionic Info

Additional Information

33 remaining items

Metadata

Assignees

Labels

Type

Fields

Projects

Milestone

Relationships

Development

bug: (external) angular domino returns undefined instead of null for querySelector #27564

Description

Prerequisites

Ionic Framework Version

Current Behavior

Expected Behavior

Steps to Reproduce

Code Reproduction URL

Ionic Info

Additional Information

Activity

aleksander351 commented on May 28, 2023

ionitron-bot commented on May 30, 2023

aleksander351 commented on May 31, 2023

Saqib92 commented on Jun 1, 2023

averyrousseau commented on Jun 1, 2023

aleksander351 commented on Jun 4, 2023

averyrousseau commented on Jun 6, 2023

lilian131 commented on Jun 7, 2023

33 remaining items

b-chowdr commented on Jul 16, 2023

liamdebeasi commented on Jul 17, 2023

liamdebeasi commented on Jul 17, 2023

mwyld commented on Feb 15, 2024

aleksander351 commented on Jun 22, 2024

ionitron-bot commented on Jul 22, 2024

Metadata

Metadata

Assignees

Labels

Type

Fields

Projects

Milestone

Relationships

Development

Issue actions