Typescript issues with @optimizely/optimizely-sdk@4.1.1

[mattgrill]

What I wanted to do

Use @optimizely/react-sdk@^2.4.0 and subsequently @optimizely/optimizely-sdk@^4.1.1 with create-react-app (react-scripts@^3.4.1)

What I expected to happen

When upgrading from @optimizely/react-sdk@2.3.1 to @optimizely/react-sdk@^2.4.0 the application should build and start correctly.

What actually happened

Multiple Typescript errors,

node_modules/@optimizely/optimizely-sdk/lib/optimizely/index.ts:597:39 - error TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'Partial<Record<"feature_key" | "user_id" | "variable_key" | "experiment_key" | "event_key", unknown>>'.
  No index signature with a parameter of type 'string' was found on type 'Partial<Record<"feature_key" | "user_id" | "variable_key" | "experiment_key" | "event_key", unknown>>'.

597         if (!stringValidator.validate(stringInputs[key])) {
                                          ~~~~~~~~~~~~~~~~~

• Perhaps, key as "feature_key" | "user_id" | "variable_key" | "experiment_key" | "event_key" could be used to resolve this.

node_modules/@optimizely/optimizely-sdk/lib/optimizely/index.ts:1192:9 - error TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{}'.
  No index signature with a parameter of type 'string' was found on type '{}'.

1192         allVariables[variable.key] = this.getFeatureVariableValueFromVariation(featureKey, featureEnabled, decisionObj.variation, variable, userId);
             ~~~~~~~~~~~~~~~~~~~~~~~~~~

• Perhaps const allVariables: {[key: string]: unknown} = {}; could be used to fix this.

node_modules/@optimizely/optimizely-sdk/lib/utils/attributes_validator/index.ts:33:18 - error TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type '{}'.
  No index signature with a parameter of type 'string' was found on type '{}'.

33       if (typeof attributes[key] === 'undefined') {
                    ~~~~~~~~~~~~~~~

node_modules/@optimizely/optimizely-sdk/lib/utils/fns/index.ts:55:12 - error TS7053: Element implicitly has an 'any' type because expression of type 'string' can't be used to index type 'unknown'.
  No index signature with a parameter of type 'string' was found on type 'unknown'.

55     return item[key];
              ~~~~~~~~~

node_modules/@optimizely/optimizely-sdk/lib/utils/user_profile_service_validator/index.ts:36:16 - error TS7053: Element implicitly has an 'any' type because expression of type '"lookup"' can't be used to index type '{}'.
  Property 'lookup' does not exist on type '{}'.

36     if (typeof userProfileServiceInstance['lookup'] !== 'function') {
                  ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

• Perhaps resolving if userProfileServiceInstance could not be an unknown

node_modules/@optimizely/optimizely-sdk/lib/utils/user_profile_service_validator/index.ts:38:23 - error TS7053: Element implicitly has an 'any' type because expression of type '"save"' can't be used to index type '{}'.
  Property 'save' does not exist on type '{}'.

38     } else if (typeof userProfileServiceInstance['save'] !== 'function') {
                         ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

[mattgrill]

Some additional information, when reverting to @optimizely/react-sdk@2.3.1 and subsequently, @optimizely/optimizely-sdk@4.3.1 it appears that only transpiled code (.js) is shipped, compared to shipping actual Typescript source in @optimizely/optimizely-sdk@^4.1.1.

[mjc1283]

@mattgrill For @optimizely/optimizely-sdk, we publish plain JS files in the dist/ directory, and point to those via the "main", "module", "browser", and "react-native" properties of package.json. Would you be able to consume the SDK via one of those plain JS files in dist/, or do you need to pull in our TypeScript source code? Some of the errors might be due to differences in our tsconfig.json compared to the one in your project.

[alessbell]

Experiencing the same issue -- tsconfig's exclude and skipLibCheck don't help. Downgraded to v4.3.4.

[mattgrill]

@mjc1283 Thanks for following up.

I think the Typescript issues are just a side effect of the actual problem. I can see the transpiled filed in the /dist directory, however, it doesn't appear that these files are getting picked up. Additionally, we aren't referencing them directly, but they are being picked up through the react-sdk package.

[mattgrill]

@mjc1283 - I actually went ahead and created very slimmed down version of our project that produces the same error, https://github.com/mattgrill/optimizely-sdk-demo Thanks!

edit

I did forget to mention that this is running on Node v12.16.3

[jamesovens]

Had the same problem using version 4.4.1 and version v14.15.0 of node.

Tried multiple options with exclude etc in tsconfig, but due to how typescript module resolution works as soon as we import the optimizely sdk, then the sdk will be included by typescript:
https://github.com/Microsoft/TypeScript/wiki/FAQ#why-is-a-file-in-the-exclude-list-still-picked-up-by-the-compiler

Downgrading to 4.3.4 has fixed the problem for now.

[yavorona]

@mattgrill, @alessbell, and @jamesovens thank you for reporting this issue. The fixes have been merged and released in optimizely-sdk v4.4.3. We also released react-sdk v2.4.1 with upgraded optimizely-sdk package.