Refs are broken after update to 4.0

[jakubriedl]

After updating to 4.0 our otherwise valid schema started to fail because openapi-typescript generated invalid output.

When we have an object like this

Account:
      type: object
      properties:
        config:
          $ref: '#/components/schemas/Accountconfig'

after updating to 4.0 it fails with

SyntaxError: Invalid character. (50:31)
  48 | };
  49 | readonly "Account": {
> 50 | readonly "config": #/components/schemas/Accountconfig;
     |                               ^
    at e (/Users/jakubriedl/repositories/cultureamp/unified-home/node_modules/prettier/parser-typescript.js:1:322)
    at /Users/jakubriedl/repositories/cultureamp/unified-home/node_modules/prettier/parser-typescript.js:22:3244464
    at Object.parse (/Users/jakubriedl/repositories/cultureamp/unified-home/node_modules/prettier/parser-typescript.js:22:3244497)
    at Object.parse$a [as parse] (/Users/jakubriedl/repositories/cultureamp/unified-home/node_modules/prettier/index.js:13652:19)
    at coreFormat (/Users/jakubriedl/repositories/cultureamp/unified-home/node_modules/prettier/index.js:15183:16)
    at formatWithCursor$1 (/Users/jakubriedl/repositories/cultureamp/unified-home/node_modules/prettier/index.js:15423:14)
    at /Users/jakubriedl/repositories/cultureamp/unified-home/node_modules/prettier/index.js:60171:12
    at Object.format (/Users/jakubriedl/repositories/cultureamp/unified-home/node_modules/prettier/index.js:60191:12)
    at Object.openapiTS [as default] (/Users/jakubriedl/repositories/cultureamp/unified-home/node_modules/openapi-typescript/src/index.ts:101:19)
    at generateTypesForApi (/Users/jakubriedl/repositories/cultureamp/unified-home/codegen/steps/generateTypes.ts:33:37) {

In version 3.4.1 it works without any problem

[linhaobin]

same problem

[Psychopoulet]

same

[drwpow]

@jakubriedl are you able to provide a more full spec? Also are you using --raw-schema by chance?

[jakubriedl]

We are not using --raw-schema.

This is how we call it

    const output = await openapiToTS(schema, {
      prettierConfig: path.resolve(process.cwd(), ".prettierrc.js"),
      immutableTypes: true,
    })

Full schema file, just had to add .txt to be able to upload it here schema.yaml

[drwpow]

@jakubriedl thanks for providing that schema. But I’m not able to reproduce that error; that schema seems to be working correctly for me, both using the Node.js API as you’re doing as well as the CLI. Even with the settings you provided.

I even tried using npx to make sure that the published version was correct, and that seems to be working properly as well.

I’m also not seeing any references from your original post, such as Accountconfig. Is the schema you provided complete? (you can create a new Gist if you need to upload the whole thing).

[jakubriedl]

I simplified the original example to make it easier to understand. The actual error is with Accountengagementconfig. No idea why it works for you, it seems other people have the issue as well.

[Psychopoulet]

yes, I do. It doesn't work with refs, as "#/components/schemas/Accountconfig" with me, it brokes on "#/".
I work on windows

[10:16:16] Invalid character. (77:14)
75 | "UpdateAvailable": {
76 | "available": true;

77 | "progress": #/components/schemas/Percentage;
78 | "priority": #/components/schemas/UpdatePriority;
79 |
80 | };
SyntaxError: Invalid character. (77:14)
75 | "UpdateAvailable": {
76 | "available": true;
77 | "progress": #/components/schemas/Percentage;
78 | "priority": #/components/schemas/UpdatePriority;
79 |
80 | };
at e (C:\Users\xxx\Documents\projets\xxx\node_modules\prettier\parser-typescript.js:1:322)
at C:\Users\xxx\Documents\projets\xxx\node_modules\prettier\parser-typescript.js:22:3244464
at Object.parse (C:\Users\xxx\Documents\projets\xxx\node_modules\prettier\parser-typescript.js:22:3244497)
at Object.parse$a [as parse] (C:\Users\xxx\Documents\projets\xxx\node_modules\prettier\index.js:13652:19)
at coreFormat (C:\Users\xxx\Documents\projets\xxx\node_modules\prettier\index.js:15183:16)
at formatWithCursor$1 (C:\Users\xxx\Documents\projets\xxx\node_modules\prettier\index.js:15423:14)
at C:\Users\xxx\Documents\projets\xxx\node_modules\prettier\index.js:60171:12
at Object.format (C:\Users\xxx\Documents\projets\xxx\node_modules\prettier\index.js:60191:12)
at openapiTS (C:\Users\xxx\Documents\projets\xxx\node_modules\openapi-typescript\dist\cjs\index.js:116:31)
at C:\Users\xxx\Documents\projets\xxx\build\build-plugins-fronts\utils\compileSchemas.js:84:14 {
loc: { start: { line: 77, column: 14 } },
codeFrame: '\x1B[0m \x1B[90m 75 |\x1B[39m \x1B[32m"UpdateAvailable"\x1B[39m\x1B[33m:\x1B[39m {\x1B[0m\n' +
'\x1B[0m \x1B[90m 76 |\x1B[39m \x1B[32m"available"\x1B[39m\x1B[33m:\x1B[39m \x1B[36mtrue\x1B[39m\x1B[33m;\x1B[39m\x1B[0m\n' +
'\x1B[0m\x1B[31m\x1B[1m>\x1B[22m\x1B[39m\x1B[90m 77 |\x1B[39m \x1B[32m"progress"\x1B[39m\x1B[33m:\x1B[39m \x1B[33m#\x1B[39m\x1B[33m/\x1B[39mcomponents\x1B[33m/\x1B[39mschemas\x1B[33m/\x1B[39m\x1B[33mPercentage\x1B[39m\x1B[33m;\x1B[39m\x1B[0m\n' +
'\x1B[0m \x1B[90m |\x1B[39m \x1B[31m\x1B[1m^\x1B[22m\x1B[39m\x1B[0m\n' +
'\x1B[0m \x1B[90m 78 |\x1B[39m \x1B[32m"priority"\x1B[39m\x1B[33m:\x1B[39m \x1B[33m#\x1B[39m\x1B[33m/\x1B[39mcomponents\x1B[33m/\x1B[39mschemas\x1B[33m/\x1B[39m\x1B[33mUpdatePriority\x1B[39m\x1B[33m;\x1B[39m\x1B[0m\n' +
'\x1B[0m \x1B[90m 79 |\x1B[39m\x1B[0m\n' +
'\x1B[0m \x1B[90m 80 |\x1B[39m }\x1B[33m;\x1B[39m\x1B[0m'
}

[drwpow]

I do think that there’s a bug somewhere here, but I’m not sure where. Here’s a Draft PR with that schema uploaded, and you can see that it’s generating correctly on both Linux and Windows machines (all checks are passing).

Is there any more info you’re able to share? Operating system? Node version? The full schema (you said you simplified it)? If anyone is able to create a PR with a failing test then I can do the rest, but I’m still not sure where the bug is or how to reproduce it.

[jakubriedl]

The file I uploaded is complete (the example in description was simplified). I'm generating that on Mac with the code shown above and node version 14.15.4.

schema in the example is type OpenAPI3 & { servers?: { url: string; description?: string }[] } parsed using js-yaml

[drwpow]

Can you take a look at the linked PR and tell me what I’m missing? That would be most helpful, thanks.

[dnalborczyk]

@jakubriedl @linhaobin could you create a small standalone repository which reproduces your issue?

[linhaobin]

const fetch = require('node-fetch');
const swaggerToTS = require('openapi-typescript').default;

const prettierConfig = path.resolve(__dirname, '../.prettier.config.js');
const swaggerUrl = '';

// error
const swaggerRes = await fetch(swaggerUrl);
const swaggerJson = await swaggerRes.json();
const content = await swaggerToTS(swaggerJson, { prettierConfig });

// success
const content = await swaggerToTS(swaggerUrl, { prettierConfig });

[drwpow]

@linhaobin thank you! That was the context we were missing. I’m able to reproduce the error when passing in JSON.