The computer has come to shape our world and the universe. It is so important that we cannot do without this fantastic invention. You would have heard about networking before. Networking is all about connection, the concept of networking can be applied to every facet of human life. It refers to a computer as well.

Error handling response: Error: Failed to execute 'surroundContents' on 'Range': The Range has partially selected a non-Text node

Anil

I have a following error "Error handling response: Error: Failed to execute 'surroundContents' on 'Range': The Range has partially selected a non-Text node." when trying to execute this code

I have a burger menu that I want to be responsive

function Burger() {
  const [open, setOpen] = useState(false);

  function openMenu() {
    setOpen(!open);
  }

  return (
    <NavBurger open={open} onclick={openMenu}>
      {Array.from({ length: 3 }).map(() => (
        <span />
      ))}
    </NavBurger>
  );
}

And here is styled component for this component

const NavBurger = styled.div`
  width: 20px;
  height: 36px;
  padding: 13px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
  justify-content: space-between;
  cursor: pointer;

  span {
    display: inline-block;
    width: 100%;
    height: 1px;
    background-color: #d3d3d3;

    transform-origin: 1px;
    transition: ease-out 0.5s; */

     &:nth-child(1) {
      transform: ${({ open }) => (open ? "rotate(45deg)" : "rotate(0")};
    }

    &:nth-child(2) {
      transform: ${({ open }) => (open ? "translateX(100%)" : "translateX(0)};
    }

    &:nth-child(3) {
      transform: ${({ open }) => (open ? "rotate(-45deg)" : "rotate(0")};
    } 
  }
`

the 'open' does not appear after clicking on the burger component, but the error appears after few clicks

Would really appreciate the answers about what can cause this error and how to fix it!