Skip to content

Typescript-fetch: file upload and Typescript dependency updates #4852

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Closed
russtacular wants to merge 8 commits into from
Closed

Typescript-fetch: file upload and Typescript dependency updates #4852

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
047debb
Update TypeScript to v2.07+, update deps, remove typings
russtacular Oct 31, 2016
89c842b
Typescript-fetch: Send multipart data if file is detected
russtacular Feb 14, 2017
9c2cb6c
Typescript-fetch: update petstore built files
russtacular Feb 24, 2017
86d7df2
Don't set content-type header for multipart form-data since it's dyna…
russtacular Mar 9, 2017
76733ea
Remove typings from typescript-fetch gitignore, samples, tests
russtacular Mar 13, 2017
2bf37cb
Add tests for content-type header
russtacular Mar 13, 2017
ab2f069
Merge branch 'master' into typescript-fetch_file-upload-and-dependenc…
russtacular Mar 21, 2017
9521400
Merge remote-tracking branch 'swagger/master' into typescript-fetch_f…
russtacular Mar 28, 2017
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion .gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -142,7 +142,6 @@ samples/client/petstore/typescript-node/npm/node_modules
samples/client/petstore/typescript-node/**/typings
samples/client/petstore/typescript-angular/**/typings
samples/client/petstore/typescript-fetch/**/dist/
samples/client/petstore/typescript-fetch/**/typings
samples/client/petstore/typescript-angular2/npm/npm-debug.log
samples/client/petstore/typescript-node/npm/npm-debug.log

Expand Down
1 change: 0 additions & 1 deletion ...gger-codegen/src/main/java/io/swagger/codegen/languages/TypeScriptFetchClientCodegen.java
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,6 @@ public void processOpts() {
supportingFiles.add(new SupportingFile("git_push.sh.mustache", "", "git_push.sh"));
supportingFiles.add(new SupportingFile("README.md", "", "README.md"));
supportingFiles.add(new SupportingFile("package.json.mustache", "", "package.json"));
supportingFiles.add(new SupportingFile("typings.json.mustache", "", "typings.json"));
supportingFiles.add(new SupportingFile("tsconfig.json.mustache", "", "tsconfig.json"));
supportingFiles.add(new SupportingFile("tslint.json.mustache", "", "tslint.json"));
supportingFiles.add(new SupportingFile("gitignore", "", ".gitignore"));
Expand Down
4 changes: 2 additions & 2 deletions modules/swagger-codegen/src/main/resources/TypeScript-Fetch/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,11 +15,11 @@ Module system
* CommonJS
* ES6 module system

It can be used in both TypeScript and JavaScript. In TypeScript, the definition should be automatically resolved via `package.json`. ([Reference](http://www.typescriptlang.org/docs/handbook/typings-for-npm-packages.html))
It can be used in both TypeScript and JavaScript. In TypeScript, the definition should be automatically resolved via `package.json`. ([Reference](http://www.typescriptlang.org/docs/handbook/declaration-files/publishing.html))

### Installation ###

`swagger-codegen` does not generate JavaScript directly. The generated Node module comes with `package.json` that bundles `typescript` and `typings` so it can self-compile during `prepublish` stage. The should be run automatically during `npm install` or `npm publish`.
`swagger-codegen` does not generate JavaScript directly. The generated Node module comes with `package.json` that bundles `typescript` so it can self-compile during `prepublish` stage. The should be run automatically during `npm install` or `npm publish`.

CAVEAT: Due to [privilege implications](https://docs.npmjs.com/misc/scripts#user), `npm` would skip all scripts if the user is `root`. You would need to manually run it with `npm run prepublish` or run `npm install --unsafe-perm`.

Expand Down
26 changes: 19 additions & 7 deletions modules/swagger-codegen/src/main/resources/TypeScript-Fetch/api.mustache
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -46,7 +46,7 @@ export type {{{classname}}} = {{#allowableValues}}{{#values}}"{{{.}}}"{{^-last}}
* {{{description}}}
*/
{{/description}}
"{{name}}"{{^required}}?{{/required}}: {{#isEnum}}{{{datatypeWithEnum}}}{{/isEnum}}{{^isEnum}}{{{datatype}}}{{/isEnum}};
"{{baseName}}"{{^required}}?{{/required}}: {{#isEnum}}{{{datatypeWithEnum}}}{{/isEnum}}{{^isEnum}}{{{datatype}}}{{/isEnum}};
{{/vars}}
{{^isEnum}}
}
Expand Down Expand Up @@ -100,12 +100,24 @@ export const {{classname}}FetchParamCreator = {

let contentTypeHeader: Dictionary<string> = {};
{{#hasFormParams}}
contentTypeHeader = { "Content-Type": "application/x-www-form-urlencoded" };
fetchOptions.body = querystring.stringify({
{{#formParams}}
"{{baseName}}": params["{{paramName}}"],
{{/formParams}}
});
let formData: Dictionary<any> = {};
let isMultipartData = false;
{{#formParams}}
{{#isFile}}isMultipartData = true;
{{/isFile}}formData["{{baseName}}"] = params["{{paramName}}"];
{{/formParams}}

if (isMultipartData) {
Copy link
Contributor

@Vrolijkx Vrolijkx Mar 6, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Why not instead of this if statement in all the generated code. Use a Mustache if. This way you don't need the next strange code:

let isMultipartData = false;
isMultipartData = true;

maybe do something like this:

{{#isFile}}
  let body = new FormData();
  for (let key in formData) {
     body.append(key, formData[key]);
  }
 fetchOptions.body = body;
 contentTypeHeader = { "Content-Type": "multipart/form-data" };
{{/isFile}}
{{^isFile}}
   fetchOptions.body = querystring.stringify(formData);
   contentTypeHeader = { "Content-Type": "application/x-www-form-urlencoded" };
{{#isFile}}

Copy link
Author

@russtacular russtacular Mar 6, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I originally used a very similar implementation to the one you suggested and also mentioned in #3921 but noticed that, since {{#isFile}} is scoped to the individual parameter, it didn't work for requests that included a file and regular form parameters. I checked again and, unless I'm looping through the individual formParams, {{#isFile}} always maps to false.

Is there a Mustache template variable available that tracks if any of the included FormData attributes is of type file? If so, that would allow me to simplify the mustache template to essentially match your suggestion and get rid of the seemingly extraneous code.

Copy link
Contributor

@wing328 wing328 Mar 7, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Is there a Mustache template variable available that tracks if any of the included FormData attributes is of type file?

Not that I'm aware of. If it helps, we can introduce the variable.

let body = new FormData();
for (let key in formData) {
body.append(key, formData[key]);
}
fetchOptions.body = body;
}
else {
fetchOptions.body = querystring.stringify(formData);
contentTypeHeader = { "Content-Type": "application/x-www-form-urlencoded" };
}
{{/hasFormParams}}
{{#hasBodyParam}}
contentTypeHeader = { "Content-Type": "application/json" };{{#bodyParam}}
Expand Down
1 change: 0 additions & 1 deletion modules/swagger-codegen/src/main/resources/TypeScript-Fetch/gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,2 @@
wwwroot/*.js
node_modules
typings
12 changes: 7 additions & 5 deletions modules/swagger-codegen/src/main/resources/TypeScript-Fetch/package.json.mustache
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,16 +6,18 @@
"browser": "./dist/api.js",
"typings": "./dist/api.d.ts",
"dependencies": {
{{^supportsES6}}"core-js": "^2.4.0",
{{/supportsES6}}"isomorphic-fetch": "^2.2.1"
"@types/node": "6.0.46",
Copy link
Contributor

@Vrolijkx Vrolijkx Mar 6, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Would be nice to also have this in the angular2 && angular clients.

Copy link
Author

@russtacular russtacular Mar 6, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

I started looking at updating angular2 but I'm having issues building the copy in master using either TS 1.8.10 or my installed typescript@next developers build. I'm sure my unfamiliarity with building and using the angular generated libraries isn't helping either!

I can look into this but I think it may require more extensive changes and that it's likely better suited for a follow up PR. Is that okay with you?

Copy link
Contributor

@Vrolijkx Vrolijkx Mar 7, 2017

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

sure.

"@types/isomorphic-fetch": "0.0.33",{{^supportsES6}}
"@types/core-js": "0.9.35",
"core-js": "2.4.1",{{/supportsES6}}
"isomorphic-fetch": "2.2.1"
},
"scripts" : {
"prepublish" : "typings install && tsc",
"prepublish" : "tsc",
"test": "tslint api.ts"
},
"devDependencies": {
"tslint": "^3.15.1",
"typescript": "^1.8.10",
"typings": "^1.0.4"
"typescript": "^2.0.7"
}
}
5 changes: 1 addition & 4 deletions modules/swagger-codegen/src/main/resources/TypeScript-Fetch/tsconfig.json.mustache
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,6 @@
},
"exclude": [
"dist",
"node_modules",
"typings/browser",
"typings/main",
"typings/main.d.ts"
"node_modules"
]
}
9 changes: 0 additions & 9 deletions modules/swagger-codegen/src/main/resources/TypeScript-Fetch/typings.json.mustache
View file
Open in desktop

This file was deleted.

1 change: 0 additions & 1 deletion samples/client/petstore/typescript-fetch/builds/default/.gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,2 @@
wwwroot/*.js
node_modules
typings
4 changes: 2 additions & 2 deletions samples/client/petstore/typescript-fetch/builds/default/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,11 +15,11 @@ Module system
* CommonJS
* ES6 module system

It can be used in both TypeScript and JavaScript. In TypeScript, the definition should be automatically resolved via `package.json`. ([Reference](http://www.typescriptlang.org/docs/handbook/typings-for-npm-packages.html))
It can be used in both TypeScript and JavaScript. In TypeScript, the definition should be automatically resolved via `package.json`. ([Reference](http://www.typescriptlang.org/docs/handbook/declaration-files/publishing.html))

### Installation ###

`swagger-codegen` does not generate JavaScript directly. The generated Node module comes with `package.json` that bundles `typescript` and `typings` so it can self-compile during `prepublish` stage. The should be run automatically during `npm install` or `npm publish`.
`swagger-codegen` does not generate JavaScript directly. The generated Node module comes with `package.json` that bundles `typescript` so it can self-compile during `prepublish` stage. The should be run automatically during `npm install` or `npm publish`.

CAVEAT: Due to [privilege implications](https://docs.npmjs.com/misc/scripts#user), `npm` would skip all scripts if the user is `root`. You would need to manually run it with `npm run prepublish` or run `npm install --unsafe-perm`.

Expand Down
43 changes: 33 additions & 10 deletions samples/client/petstore/typescript-fetch/builds/default/api.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -249,11 +249,22 @@ export const PetApiFetchParamCreator = {
let fetchOptions: RequestInit = assign({}, { method: "POST" }, options);

let contentTypeHeader: Dictionary<string> = {};
contentTypeHeader = { "Content-Type": "application/x-www-form-urlencoded" };
fetchOptions.body = querystring.stringify({
"name": params["name"],
"status": params["status"],
});
let formData: Dictionary<any> = {};
let isMultipartData = false;
formData["name"] = params["name"];
formData["status"] = params["status"];

if (isMultipartData) {
let body = new FormData();
for (let key in formData) {
body.append(key, formData[key]);
}
fetchOptions.body = body;
}
else {
fetchOptions.body = querystring.stringify(formData);
contentTypeHeader = { "Content-Type": "application/x-www-form-urlencoded" };
}
if (contentTypeHeader) {
fetchOptions.headers = contentTypeHeader;
}
Expand All @@ -280,11 +291,23 @@ export const PetApiFetchParamCreator = {
let fetchOptions: RequestInit = assign({}, { method: "POST" }, options);

let contentTypeHeader: Dictionary<string> = {};
contentTypeHeader = { "Content-Type": "application/x-www-form-urlencoded" };
fetchOptions.body = querystring.stringify({
"additionalMetadata": params["additionalMetadata"],
"file": params["file"],
});
let formData: Dictionary<any> = {};
let isMultipartData = false;
formData["additionalMetadata"] = params["additionalMetadata"];
isMultipartData = true;
formData["file"] = params["file"];

if (isMultipartData) {
let body = new FormData();
for (let key in formData) {
body.append(key, formData[key]);
}
fetchOptions.body = body;
}
else {
fetchOptions.body = querystring.stringify(formData);
contentTypeHeader = { "Content-Type": "application/x-www-form-urlencoded" };
}
if (contentTypeHeader) {
fetchOptions.headers = contentTypeHeader;
}
Expand Down
12 changes: 7 additions & 5 deletions samples/client/petstore/typescript-fetch/builds/default/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,16 +6,18 @@
"browser": "./dist/api.js",
"typings": "./dist/api.d.ts",
"dependencies": {
"core-js": "^2.4.0",
"isomorphic-fetch": "^2.2.1"
"@types/node": "6.0.46",
"@types/isomorphic-fetch": "0.0.33",
"@types/core-js": "0.9.35",
"core-js": "2.4.1",
"isomorphic-fetch": "2.2.1"
},
"scripts" : {
"prepublish" : "typings install && tsc",
"prepublish" : "tsc",
"test": "tslint api.ts"
},
"devDependencies": {
"tslint": "^3.15.1",
"typescript": "^1.8.10",
"typings": "^1.0.4"
"typescript": "^2.0.7"
}
}
5 changes: 1 addition & 4 deletions samples/client/petstore/typescript-fetch/builds/default/tsconfig.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,6 @@
},
"exclude": [
"dist",
"node_modules",
"typings/browser",
"typings/main",
"typings/main.d.ts"
"node_modules"
]
}
9 changes: 0 additions & 9 deletions samples/client/petstore/typescript-fetch/builds/default/typings.json
View file
Open in desktop

This file was deleted.

1 change: 0 additions & 1 deletion samples/client/petstore/typescript-fetch/builds/es6-target/.gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,2 @@
wwwroot/*.js
node_modules
typings
4 changes: 2 additions & 2 deletions samples/client/petstore/typescript-fetch/builds/es6-target/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,11 +15,11 @@ Module system
* CommonJS
* ES6 module system

It can be used in both TypeScript and JavaScript. In TypeScript, the definition should be automatically resolved via `package.json`. ([Reference](http://www.typescriptlang.org/docs/handbook/typings-for-npm-packages.html))
It can be used in both TypeScript and JavaScript. In TypeScript, the definition should be automatically resolved via `package.json`. ([Reference](http://www.typescriptlang.org/docs/handbook/declaration-files/publishing.html))

### Installation ###

`swagger-codegen` does not generate JavaScript directly. The generated Node module comes with `package.json` that bundles `typescript` and `typings` so it can self-compile during `prepublish` stage. The should be run automatically during `npm install` or `npm publish`.
`swagger-codegen` does not generate JavaScript directly. The generated Node module comes with `package.json` that bundles `typescript` so it can self-compile during `prepublish` stage. The should be run automatically during `npm install` or `npm publish`.

CAVEAT: Due to [privilege implications](https://docs.npmjs.com/misc/scripts#user), `npm` would skip all scripts if the user is `root`. You would need to manually run it with `npm run prepublish` or run `npm install --unsafe-perm`.

Expand Down
43 changes: 33 additions & 10 deletions samples/client/petstore/typescript-fetch/builds/es6-target/api.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -248,11 +248,22 @@ export const PetApiFetchParamCreator = {
let fetchOptions: RequestInit = Object.assign({}, { method: "POST" }, options);

let contentTypeHeader: Dictionary<string> = {};
contentTypeHeader = { "Content-Type": "application/x-www-form-urlencoded" };
fetchOptions.body = querystring.stringify({
"name": params["name"],
"status": params["status"],
});
let formData: Dictionary<any> = {};
let isMultipartData = false;
formData["name"] = params["name"];
formData["status"] = params["status"];

if (isMultipartData) {
let body = new FormData();
for (let key in formData) {
body.append(key, formData[key]);
}
fetchOptions.body = body;
}
else {
fetchOptions.body = querystring.stringify(formData);
contentTypeHeader = { "Content-Type": "application/x-www-form-urlencoded" };
}
if (contentTypeHeader) {
fetchOptions.headers = contentTypeHeader;
}
Expand All @@ -279,11 +290,23 @@ export const PetApiFetchParamCreator = {
let fetchOptions: RequestInit = Object.assign({}, { method: "POST" }, options);

let contentTypeHeader: Dictionary<string> = {};
contentTypeHeader = { "Content-Type": "application/x-www-form-urlencoded" };
fetchOptions.body = querystring.stringify({
"additionalMetadata": params["additionalMetadata"],
"file": params["file"],
});
let formData: Dictionary<any> = {};
let isMultipartData = false;
formData["additionalMetadata"] = params["additionalMetadata"];
isMultipartData = true;
formData["file"] = params["file"];

if (isMultipartData) {
let body = new FormData();
for (let key in formData) {
body.append(key, formData[key]);
}
fetchOptions.body = body;
}
else {
fetchOptions.body = querystring.stringify(formData);
contentTypeHeader = { "Content-Type": "application/x-www-form-urlencoded" };
}
if (contentTypeHeader) {
fetchOptions.headers = contentTypeHeader;
}
Expand Down
9 changes: 5 additions & 4 deletions samples/client/petstore/typescript-fetch/builds/es6-target/package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6,15 +6,16 @@
"browser": "./dist/api.js",
"typings": "./dist/api.d.ts",
"dependencies": {
"isomorphic-fetch": "^2.2.1"
"@types/node": "6.0.46",
"@types/isomorphic-fetch": "0.0.33",
"isomorphic-fetch": "2.2.1"
},
"scripts" : {
"prepublish" : "typings install && tsc",
"prepublish" : "tsc",
"test": "tslint api.ts"
},
"devDependencies": {
"tslint": "^3.15.1",
"typescript": "^1.8.10",
"typings": "^1.0.4"
"typescript": "^2.0.7"
}
}
5 changes: 1 addition & 4 deletions samples/client/petstore/typescript-fetch/builds/es6-target/tsconfig.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,9 +9,6 @@
},
"exclude": [
"dist",
"node_modules",
"typings/browser",
"typings/main",
"typings/main.d.ts"
"node_modules"
]
}
8 changes: 0 additions & 8 deletions samples/client/petstore/typescript-fetch/builds/es6-target/typings.json
View file
Open in desktop

This file was deleted.

1 change: 0 additions & 1 deletion samples/client/petstore/typescript-fetch/builds/with-npm-version/.gitignore
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,3 +1,2 @@
wwwroot/*.js
node_modules
typings
4 changes: 2 additions & 2 deletions samples/client/petstore/typescript-fetch/builds/with-npm-version/README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,11 +15,11 @@ Module system
* CommonJS
* ES6 module system

It can be used in both TypeScript and JavaScript. In TypeScript, the definition should be automatically resolved via `package.json`. ([Reference](http://www.typescriptlang.org/docs/handbook/typings-for-npm-packages.html))
It can be used in both TypeScript and JavaScript. In TypeScript, the definition should be automatically resolved via `package.json`. ([Reference](http://www.typescriptlang.org/docs/handbook/declaration-files/publishing.html))

### Installation ###

`swagger-codegen` does not generate JavaScript directly. The generated Node module comes with `package.json` that bundles `typescript` and `typings` so it can self-compile during `prepublish` stage. The should be run automatically during `npm install` or `npm publish`.
`swagger-codegen` does not generate JavaScript directly. The generated Node module comes with `package.json` that bundles `typescript` so it can self-compile during `prepublish` stage. The should be run automatically during `npm install` or `npm publish`.

CAVEAT: Due to [privilege implications](https://docs.npmjs.com/misc/scripts#user), `npm` would skip all scripts if the user is `root`. You would need to manually run it with `npm run prepublish` or run `npm install --unsafe-perm`.

Expand Down
Loading