TypeScript does not recognize URLSearchParams as iterable

Question

I am getting the following error trying to build a small TypeScript project with yarn & webpack:

TS2549: Type 'URLSearchParams' is not an array type or a string type or does not have a '[Symbol.iterator]()' method that returns an iterator.

I'm trying to use a Node built-in URLSearchParams object in a simple loop:

for (let [name, value] of searchParams) {
    //do stuff
}

The Node LTS version 12 docs show that the Symbol.iterator method exists. It works in the Node REPL.

I found a closed issue in the TypeScript repo from 2017 that supposedly resolved this error. But I also tried using searchParams.entries() and the validator did not recognize it as an available property. So it feels like my TypeScript has a very out-of-date definition for URLSearchParams. Maybe this is just a packaging issue but I don't know how to investigate further. The yarn.lock file shows appropriate node types:

"@types/node@^12":
  version "12.12.53"
  resolved "https://registry.yarnpkg.com/@types/node/-/node-12.12.53.tgz#be0d375933c3d15ef2380dafb3b0350ea7021129"
  integrity sha512-51MYTDTyCziHb70wtGNFRwB4l+5JNvdqzFSkbDvpbftEgVUBEE+T5f7pROhWMp/fxp07oNIEQZd5bbfAH22ohQ==

typescript@^3.9.7:
  version "3.9.7"
  resolved "https://registry.yarnpkg.com/typescript/-/typescript-3.9.7.tgz#98d600a5ebdc38f40cb277522f12dc800e9e25fa"
  integrity sha512-BLbiRkiBzAwsjut4x/dsibSTB6yWpwT5qWmC2OfuCg3GgVQCSgMs4vEctYPhsaGtd0AeuuHMkjZ2h2WG8MSzRw==

When I look at the local copies of the Typescript definition files I see the addition of Iterable-related properties in lib.dom.iterable.d.ts (as mentioned in that closed GitHub issue). Somehow those are being ignored.

I can rewrite my code to use searchParams.forEach() instead, but I'd like to understand what's going wrong anyway.

Is your compiler target "es6" in tsconfig.json? That might solve this issue. — Shukant Pal
– Shukant Pal, Commented Aug 9, 2020 at 2:45
The file has "target": "es5". I did not set up this project, but I don't know why it would be using an old target. It will be running on a Node 12 instance. I tried changing that to es6, but Visual Studio Code still gives me the same errors. Haven't actually tried to run the build again. — giskard22
– giskard22, Commented Aug 10, 2020 at 15:35

giskard22 · Accepted Answer · 2020-08-10 22:44:43Z

37

As the original post speculates, the additional definitions in lib.dom.iterable.d.ts are not being used. The project's TypeScript config in tsconfig.json has to reference that file:

"lib": [
  "dom",
  "dom.iterable",
  "es2019"
]

With this, TypeScript now understands iterator-related properties for URLSearchParams and about 50 other types referenced in that file. I assume the separation is related to TypeScript backwards compatibility with older ECMAScript flavors, but I don't know.

answered Aug 10, 2020 at 22:44

giskard22

8931 gold badge7 silver badges15 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

PokatilovArt Over a year ago

For me it's worked only after adding "downlevelIteration": true to tsconfig.json

Janis Over a year ago

For me, adding "DOM.Iterable" worked.

Pavlo Zhukov Over a year ago

Adding @types/node also helps with adding necessary iterator values.

1.21 gigawatts Over a year ago

I don't have a lib key in my tsconfig. Can you define this in the target key? I have it set to ES6 currently. I'm getting this error on searchParams.size but I'm guessing it's related. error TS2339: Property 'size' does not exist on type 'URLSearchParams'.

Reza Mahmoodi · Accepted Answer · 2023-01-24 09:01:07Z

-3

update typescript
delete local node_modules
delete package-lock.json | yarn.lock.json
install node modules

answered Jan 24, 2023 at 9:01

Reza Mahmoodi

8267 silver badges9 bronze badges

Comments

Emanuel Lindström · Accepted Answer · 2023-04-06 00:17:54Z

-4

In my case it was TSLint that complained about having the URLSearchParams object in a template literal.

I used the toString-method to return a string instead.


const params = new URLSearchParams({
      client_id: CLIENT_ID
      client_secret: CLIENT_SECRET
    }).toString()
const url = `https://www.some_endpoint.com/token?${params}`;

answered Apr 6, 2023 at 0:17

Emanuel Lindström

2,10724 silver badges27 bronze badges

Collectives™ on Stack Overflow

TypeScript does not recognize URLSearchParams as iterable

3 Answers 3

4 Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

4 Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related