Can't get childNodes computedStyle

Question

Can't get childNodes computedStyle, getting an error:

Uncaught TypeError: Failed to execute 'getComputedStyle' on 'Window': parameter 1 is not of type 'Element'

let wrappers = document.querySelectorAll('[data-attribute="wrapper"]');
  wrappers = Array.prototype.slice.call(wrappers);

  wrappers.forEach((el) => {
    let wrappersChildren = wrappers.slice.call(el.childNodes, 0);

    wrappersChildren.forEach((el) => {
      const childrenWidth = window.getComputedStyle(el).width;
      ...

Where i did mistake?

Answer 1

Using el.childNodes is the mistake, as it returns text nodes too. Use el.children instead

Here is the fixed code:

let wrappers = document.querySelectorAll('[data-attribute="wrapper"]');
  wrappers = Array.prototype.slice.call(wrappers);

  wrappers.forEach((el) => {
    let wrappersChildren = wrappers.slice.call(el.children, 0);

    wrappersChildren.forEach((el) => {
      const childrenWidth = window.getComputedStyle(el).width;
      ...