Re: [w3c/FileAPI] Why are Blob() and File() constructors at Chromium 81 throwing RangeError? (#147)

Some observations when `Blob` is passed as the innermost element of an array of arrays

```
var MY_JSON_FILE = [new Blob([1])];

var blob = new Blob(MY_JSON_FILE);

var fr = new FileReader();

fr.addEventListener("load", e => {
  console.log(e.target.result)
});

fr.readAsText(blob);
```

logs the string

`1` 

```
var MY_JSON_FILE = [[new  Blob([1])]];

var blob = new Blob(MY_JSON_FILE);

var fr = new FileReader();

fr.addEventListener("load", e => {
  console.log(e.target.result)
});

fr.readAsText(blob);
```

and 

```
var MY_JSON_FILE = [[new  Blob([1])]];

var blob = new Blob(MY_JSON_FILE);

var fr = new FileReader();

fr.addEventListener("load", e => {
  console.log(new TextDecoder().decode(new Uint8Array(e.target.result)))
});
```

fr.readAsArrayBuffer(blob);

logs string

`[object Blob]`

```
var MY_JSON_FILE = [[[`{
  "hello": "world"
}`]]];

var blob = new Blob([[MY_JSON_FILE]]);

var fr = new FileReader();

fr.addEventListener("load", e => {
  console.log(e.target.result)
});

fr.readAsText(blob);
```

and 

```
var MY_JSON_FILE = [`{
  "hello": "world"
}`];

var blob = new Blob(MY_JSON_FILE);

var fr = new FileReader();

fr.addEventListener("load", e => {
  console.log(e.target.result)
});

fr.readAsText(blob);
```

logs 

```
{
  "hello": "world"
}
```
for an array of arrays

```
var blob = new Blob(..."1");

var fr = new FileReader();

fr.addEventListener("load", e => {
  console.log(new TextDecoder().decode(new Uint8Array(e.target.result)))
});

fr.readAsArrayBuffer(blob);
```

logs

`Uncaught TypeError: Failed to construct 'Blob': The provided value cannot be converted to a sequence.`

```
var MY_JSON_FILE = [new  Blob([1])];

var blob = new Blob(...MY_JSON_FILE);

var fr = new FileReader();

fr.addEventListener("load", e => {
  console.log(new TextDecoder().decode(new Uint8Array(e.target.result)))
});

fr.readAsArrayBuffer(blob);
```

logs

`Uncaught TypeError: Failed to construct 'Blob': The object must have a callable @@iterator property.`

```
var MY_JSON_FILE = [[new  Blob([1]), new Blob([2])]];

var blob = new Blob(MY_JSON_FILE);

var fr = new FileReader();

fr.addEventListener("load", e => {
  console.log(e.target.result)
});

fr.readAsText(blob);
```

logs

`[object Blob],[object Blob]`

in this case for array of arrays one solution is, per https://stackoverflow.com/a/37152508 

> `fun(a, b, ...c)`: This construct [doesn't actually have a name in the spec](http://www.ecma-international.org/ecma-262/6.0/#sec-left-hand-side-expressions). But it works very similar as spread elements do: It expands an iterable into the list of arguments.
It would be equivalent to func.apply(null, [a, b].concat(c)).

where 

```
var MY_JSON_FILE = [[new  Blob([1]), new Blob([2])]];

var blob = new Blob(...MY_JSON_FILE);

var fr = new FileReader();

fr.addEventListener("load", e => {
  console.log(e.target.result)
});

fr.readAsText(blob)
```

logs 

`12`

if the N nested arrays beyond 2 are not flattened

```
var flatten  = arr => {
  arr = arr.flat();
  return arr.find(a => Array.isArray(a)) ? flatten(arr) : arr
}

var MY_JSON_FILE = [[[new  Blob([1]), new Blob([2])]], 3, ["abc"]];

var blob = new Blob(flatten(MY_JSON_FILE));

var fr = new FileReader();

fr.addEventListener("load", e => {
  console.log(new TextDecoder().decode(new Uint8Array(e.target.result)))
});

fr.readAsArrayBuffer(blob);
```

```
var MY_JSON_FILE = [[[new  Blob([1]), new Blob([2])]]];

var blob = new Blob(...MY_JSON_FILE);

var fr = new FileReader();

fr.addEventListener("load", e => {
  console.log(new TextDecoder().decode(new Uint8Array(e.target.result)))
});

fr.readAsArrayBuffer(blob);
```

the output is

`[object Blob],[object Blob]`

again.


-- 
You are receiving this because you are subscribed to this thread.
Reply to this email directly or view it on GitHub:
https://github.com/w3c/FileAPI/issues/147#issuecomment-605553187

Received on Sunday, 29 March 2020 03:34:09 UTC