Uncaught TypeError: Cannot read property 'length' of undefined

[yangm97]

react-unleash-flags/src/hooks/useFlag.ts

Line 15 in a8597e4

if (!flagsClient.getFlags().length) {

When uri returns 200 OK with a plain text body instead of a proper flags json.

[yangm97]

I tried to use this lib with GitLab feature flags but initially I got the config wrong, like this:

 const flagConfig = {
    appName: 'development',
    host: 'https://gitlab.com',
    uri: '/api/v4/feature_flags/unleash/123',
    instanceId: 'bla'
  }

For some reason unknown to me, GitLab has decided this endpoint should return 200 OK and have 200 as a plain text inside the body, which is how I found this bug.

[fvoordeckers]

@yangm97 Thanks for reporting!
As I understand the config was wrong and you are now able to use the client?

[yangm97]

@fvoordeckers hey thanks for the lib!

Yes, the config was wrong indeed but I opened this issue because it looks like fetchFlags() is not type safe.

react-unleash-flags/src/client/FlagsClient.ts

Line 71 in a8597e4

this.flags = json.features;

Will happily decode a body of 200 into a number rather than the expected type array and not fall into the catch block since primitives are considered as valid json.

We could either add a plain type check there or do a schema validation on the whole response object.

Maybe we need an error boundary regardless, what you think?

[fvoordeckers]

Indeed, good idea to add some type checking there and add a check if the configuration was valid to do the call. The library should throw an error instead of handling a 200.

[woutderooms]

I tried to use this lib with GitLab feature flags but initially I got the config wrong, like this:

 const flagConfig = {
    appName: 'development',
    host: 'https://gitlab.com',
    uri: '/api/v4/feature_flags/unleash/123',
    instanceId: 'bla'
  }

For some reason unknown to me, GitLab has decided this endpoint should return 200 OK and have 200 as a plain text inside the body, which is how I found this bug.

@yangm97 Could you elaborate on the "config change" you applied to get it working. Running into the same issue with GitLab. If it is something more people encounter, we could elaborate on the issue in the documentation.

[yangm97]

@woutderooms you need to leave uri out and append the path prefix to the host property. Like this:

 const flagConfig = {
    appName: 'development',
    host: 'https://gitlab.com/api/v4/feature_flags/unleash/123',
    instanceId: 'bla'
  }