@requestBody throwing build error because of not matching schema, but it is matching

[markus-hsk]

Hello, i need a bit of support. I recently made a npm and lb4 update for the packages. Now, while building the project i get a few errors for the @responseBody-Decorator usage.

error TS2345: Argument of type '{ description: string; required: boolean; content: { 'application/json': { schema: { type: string; required: string[]; properties: { NewPassword: { type: string; minLength: number; example:
 string; }; }; }; }; }; }' is not assignable to parameter of type 'Partial<RequestBodyObject>'.
  Types of property 'content' are incompatible.
    Type '{ 'application/json': { schema: { type: string; required: string[]; properties: { NewPassword: { type: string; minLength: number; example: string; }; }; }; }; }' is not assignable to type 'ContentObject'.
      Property ''application/json'' is incompatible with index signature.
        Type '{ schema: { type: string; required: string[]; properties: { NewPassword: { type: string; minLength: number; example: string; }; }; }; }' is not assignable to type 'MediaTypeObject'.
          Types of property 'schema' are incompatible.
            Type '{ type: string; required: string[]; properties: { NewPassword: { type: string; minLength: number; example: string; }; }; }' is not assignable to type 'ReferenceObject | SchemaObject | undefined'.
              Type '{ type: string; required: string[]; properties: { NewPassword: { type: string; minLength: number; example: string; }; }; }' is not assignable to type 'SchemaObject'.
                Types of property 'type' are incompatible.
                  Type 'string' is not assignable to type '"string" | "number" | "boolean" | "object" | "array" | "integer" | "null" | undefined'.

680         @requestBody(PutPasswordRequestBody) passwordData: PutPasswordData

The strange fact is, if i take a look into the last line Type 'string' is not assignable to type '"string" | "number" | "boolean" | "object" | "array" | "integer" | "null" | undefined'. It states, that 'string' is not assignable to 'string'. Uhm? What?

The following is my code for the specifiaction:

export const PutOwnPasswordRequestBody = {
    description: 'The input for setting a new password',
    required:    true,
    content:     {
        'application/json': {schema: PutOwnPasswordSchema}
    }
};

export const PutOwnPasswordSchema = {
    type:       'object',
    required:   ['OldPassword', 'NewPassword'],
    properties: {
       OldPassword: {
            type:      'string',
            minLength: 1,
            example:   ''
        },
        NewPassword: {
            type:      'string',
            minLength: 1,
            example:   ''
        }
    }
};

If i make a small modification on the PutOwnPasswordSchema definition (adding <SchemaObject>):

export const PutOwnPasswordSchema = <SchemaObject>{

The error from the build is gone and it works fine. It seems to me, that the build just cannot match it correctly without. But why?

Could need some help.

[achrinza]

It states, that 'string' is not assignable to 'string'. Uhm? What?

It's a bit difficult to spot at first glance, but they are actually quite different; The SchemaObject type property expects a literal string with the value string in accordance with this enum:

"string" | "number" | "boolean" | "object" | "array" | "integer" | "null" | undefined

More correctly (if we space out the quote marks), the error message is:

// Notice the double-quotes around the second "string" and not the first
'string' is not assignable to type ' "string" '

Q: But isn't it implied that the object is string since its value is already declared?

No; TypeScript will not infer types as constants because, in most cases, the developers' intent is to use a generic string. This means that the value of the object properties can change (such as in a controller's constructor) to a value outside of the enum.

Q: How could the value change? Isn't the variable a const?

In JavaScript, a const variable with a object as a value cannot be reassigned to a new object, but the object itself can be modified:

// Try this in Node.js or a web browser console
const mutateMe = {foo: 'bar'}
mutateMe.foo = 'baz';
console.log(mutateMe.foo);

This rule applies to any non-primitives such as arrays and class instances.

To force a constant, it's possible to do type: <const> 'string'. This tells TypeScript that this primitive value in the object will never change. However, there's a better way 👇

If i make a small modification ... adding ... The error from the build is gone and it works fine.

That's because it's type casting, which tells TypeScript to assume that the type is SchemaObject without checking the initialised value. While this will restrict re-assignment of type value to the enum, it is not recommended as the initial value could be arbitrary and TypeScript won't catch it.

Instead, use type declarations:

// Add `: SchemaObject`
export const PutOwnPasswordSchema: SchemaObject = {/* ,,, */};

[markus-hsk]

Your suggestion: got it, yes thats kind of better! Thanks.

But sorry if i have to ask this, i'm not sure i got what you want to explain me about the string 'string'. As far as i understood the point is, 'string' could be changed, because its not a const inside the object. Adding to that assignment would fix that? Puuuh, that's weird! Never have done such a thing.

[achrinza]

Glad it helped!

As far as i understood the point is, 'string' could be changed, because its not a const inside the object. Adding to that assignment would fix that?

If I understood correctly, the question is on how type declarations fix the issue, when const doesn't?

It's good to think of variables with non-primitive values as a pointer to a value; That is, the variable mutateMe points to memory address which contains an object. const prevents this pointer from changing memory addresses, but it does not prevent the non-primitive value at that memory address from mutating.

Type declarations don't prevent mutations of non-primitives; It's const assertions like as const and <const> that prevent mutations at the TypeScript level. Though note that like all other TypeScript type-safety features, this check disappears after transpiling into JavaScript.

In a simplified example:

type myLiteralStringType = 'foo' | 'bar';

// A function that only accepts `myLiteralStringType`
function myFunction(myInput: myLiteralStringType) { /* Do something */ }

// Here's a variable with the value "foo"
// TypeScript has inferred its type to be 'string'.
// We're using `let` instead of `const` to emulate the mutable nature of object properties.
// We're using a string instead of an object for simplification, but the idea is more-or-less the same.
let myVar = "foo"

// Error!
myFunction(myVar);

// The example above errors as we can re-assign `myVar` to something outside...
// of the supported function values before passing it to the function.

// Hey, that's not going to be accepted in the function!
myVar = 'baz';

// Error!
myFunction(myVar)

// Let's try to use type declarations
let myVar2: myLiteralStringType = 'foo';

// It works!
myFunction(myVar2);

// Still compiles, and works!
myVar2 = 'bar';
myFunction(myVar2)

// Error! "baz" is not in our special type
myVar2 = 'baz';

I've typed the example above from memory, so it may have a few minor errors, but the general idea is there.

---

If the question was "why does const assertion solve the issue?", then that's because TypeScript won't allow re-assignments of that value:

const myObj1 = {foo: 'bar', fi: 'biz'};
const myObj2 = {foo: 'bar' as const, fi: 'biz'};
const myObj3 = {foo: 'bar', fi: 'biz'} as const;

// All of these work
myObj1.foo = 'baz';
myObj2.fi = 'baz';

// But not these
myObj1 = {foo: 'baz'};
myObj2 = {foo: 'baz'};
myObj3 = {foo: 'baz'};

myObj2.foo = 'baz';
myObj3.foo = 'baz';
myObj3.fi = 'baz';

Hope this helps!

[achrinza]

Try it out in the TypeScript playground:

https://www.typescriptlang.org/play?#code/C4TwDgpgBAtiAyBLYEBOBDANgZWKxAdgOYAq40AvFAOQBmA9vdVAD40BG6q1A3AFB8A9IKgBBKLQCuBAMbBE9AlGAALdMCiLMIKOhkyIYYAGcoAAzhIUGHHkKlyZvlNnzFsEADFpchQQAUcACSBGCSwABcHlZoWLj4xGSQAJRQAN5QggBUUAAi9FDG9DAQqvZQWSIAvgLCUAASaBDUpuhQAG5ciOjsmNAA7sgqyirQnZiS0ABEDPRTQiJJENgy+EZQaqaEtGioEAAmUMimoJDKBezQLXbE1AB0C1AA6s17UJLG5WZ9wGZHBMYUOhDvRaOYZIpAX9gAUIDBJJh1NBVNB4cAen0oAR1JI3qDNOwAFYQORQMCoeiQVDyCDGB51F7UN4fcptQEJIj-QEQYGaMHoJT0IkkjQMVCFRAwMCYRC0RAydR+AA0UHY4RG0EQ+x5R1MMHoewAtAbDX1jCdRoV0CUHj8PAA1LhQKgzRjzR4AUVQFNQAEI+HBvK4-IEQI7UMl+I8SJaIAAPa3S6A9ejtaC7A2tUz9aAKpRG9DmxBEJQWMNcaEFIolMrETThT7au7Nx74lGFSRgMAGlCHFy+dzjSamS5i6BgQufOvIc4aiQ+NwEB6PRogFWqdQtLH0DREejlGGq5P6Qy9-5z-uL-1wcPOjjoABevFqIi9PuvXgXIZvXGSL6g8ClFueA6IeHzIuQUDajIiIYIuxh8HaP6oAATFEljILEtgcksd50Iwz6PEEGj9AaADWxgfkGA4BMhKGRv+uCIJgmBQBCUrMbSKoCocpGoBRH7hiheGcNw-CBl+iihkJf6et6Bq+lAUycA+Uy6tuGiEPW4rGJAMjdKxpwQAG5aoSJj6ES+wjWTZtl2fZDmOU5jkCAIEIAhocAAPJEgAjHeaSzFE1CidQKpysF7CIE+VT8O5gIeD5hLCVQgWMJFXDMIWbGQsA4WIJF0XULFfDxZ5IBJQAzAFQX3tw+WFTFuimGVUZ1KILF8hqxgDORJlJb5dyzOZT7iRVRIoUNiAjYRdQAELqgQO7dcZ3l+TV6X3jFY1JSl6S1SFFklWthLValB0qcVUYnZNw1UIdo39USlVDYwM07c9U3vUAA