Spread syntax can't work with iterables (Set, Map) -- downlevelIteration issue

[maroon1]

// Input
const set = new Set([1, 2, 3]);

export const spread = [...set, 4, 5];

// Output lib.esm.js
var set =
/*#__PURE__*/
new Set([1, 2, 3]);
var spread =
/*#__PURE__*/
[].concat(set, 4, 5);

export { spread };
//# sourceMappingURL=lib.esm.js.map

Current Behavior

import { spread } from 'lib';

console.log(spread);
// [Set(3), 4, 5]

Expected behavior

import { spread } from 'lib';

console.log(spread);
// [1, 2, 3, 4, 5]

Suggested solution(s)

Additional context

Your environment

Software	Version(s)
TSDX	0.11.0
TypeScript	3.7.3
Browser	Chrome
npm/Yarn	6.12.1
Node	v13.1.0
Operating System	MacOS 10.15

[swyxio]

would love help finding root cause. bet we have a bad transform in here.

[ambroseus]

@maroon1 @sw-yx this is typescript issue
microsoft/TypeScript#8856

[ambroseus]

with option "downlevelIteration": true in tsconfig and tsdx build

const set = new Set([1, 2, 3])
console.log([...set, 4, 5])

// [ Set { 1, 2, 3 }, 4, 5 ]

meanwhile pure tsc --downlevelIteration

// [ 1, 2, 3, 4, 5 ]

...so need to check rollup/babel configs/presets

[ambroseus]

related:
https://babeljs.io/docs/en/babel-plugin-transform-spread

"plugins": [
    ["@babel/plugin-transform-spread", {
      "loose": true
    }]
  ]

loose defaults to false. In loose mode true, all iterables are assumed to be arrays.

[swyxio]

ok. got a recommendation? should we add that flag?

[ambroseus]

@sw-yx not sure yet.. still playing with babel options & configs
will provide recommendations soon))

[ambroseus]

yes, I found combination to produce correct result with spread iterables:

1. use option "downlevelIteration": true in tsconfig + "target": "es5"
2. option loose for @babel/prest-env must be set to false

do we need some fix? maybe no.. but need to add some instructions how to config tsdx in this case

[ambroseus]

another solution:

1. use option "downlevelIteration": true in tsconfig
2. tsdx build --target node
   result - es6 as is without transpilation:

const spread = [...
/*#__PURE__*/
new Set([1, 2, 3]), 4, 5];
console.log(spread);

[maroon1]

@ambroseus thx.