12

In another question posted this was there:

var a = {};
a.products = [...document.querySelectorAll('.product')];
console.log(a.products);
<div class="product"> </div>

Edge will fail with the following error:

function expected

However this is working:

    var params = ['hello', '', 7];
    var other = [ 1, 2, ...params];

console.log(params);
console.log(other);

Why isn't the top one working on Edge (it does on Chrome)?

Mouser
  • 13,132
  • 3
  • 28
  • 54
  • 1
    Have you tried `[...(document.querySelectorAll('.product'))]`? – Andrzej Smyk Oct 10 '17 at 16:45
  • 1
    I did on your suggestion, not working! – Mouser Oct 10 '17 at 16:46
  • 5
    Edge might not implement the iterator protocol for `NodeList`s? *edit:* yep: https://developer.mozilla.org/en-US/docs/Web/API/NodeList#Browser_compatibility (at least it doesn't support `entries()`, `values()`, etc, which I believe it would if it supported the iterator protocol). – Felix Kling Oct 10 '17 at 16:47
  • 1
    The error message isn't all too helpful, but it *probably* means "expected `document.querySelectorAll('.product')[Symbol.iterator]` to be a function". – Bergi Oct 10 '17 at 16:48
  • 1
    It looks like node lists were made iterable in the Windows 10 Fall Creators update: https://wpdev.uservoice.com/forums/257854-microsoft-edge-developer/suggestions/15898300-iterable-nodelists – JDB Sep 26 '19 at 19:10
  • @JDB: you are right. I've updated the question with snippets and they will now function in line with other browsers. – Mouser Sep 26 '19 at 19:29

3 Answers3

8

You could use Array.from, which generates an array from an array like object.

this.products = Array.from(document.querySelectorAll('.product'));
Nina Scholz
  • 376,160
  • 25
  • 347
  • 392
  • 2
    It's the [preferred syntax](https://stackoverflow.com/a/40549565/1048572) for type conversions anyway – Bergi Oct 10 '17 at 16:52
1

Well it looks like Bergi and Felix are on the right track: in this document on MDN they talk about iterators.

Some built-in constructs, such as the spread operator, use the same iteration protocol under the hood:

So where Array does have entries() a nodelist in Edge doesn't and does not support iteration.

Nina's answer is the goto one!

Mouser
  • 13,132
  • 3
  • 28
  • 54
0

Update to 2020, Edge is now using Chrome v8 internally. Ask the user to download latest version of Edge. No need to take care of this specific scenario in old Edge.

remondo
  • 318
  • 2
  • 7