impr: simplify processing path params

and now templates are cleaner and shorter
And also mismatch between path expression and params will be much more visible

src/gen/genOperations.spec.ts

@@ -69,13 +69,6 @@ describe('prepareOperations', () => {
         optional: true,
       });
 
-      expect(res.pathParams.pop()).to.deep.include({
-        name: 'petId',
-        originalName: 'petId',
-        type: 'number',
-        optional: true,
-      });
-
       expect(res.parameters.length).to.equal(3);
       expect(res.parameters.map((p) => p.name)).to.deep.equal(['orgID', 'orgType', 'petId']);
     });
@@ -105,6 +98,40 @@ describe('prepareOperations', () => {
       expect(op2.parameters).to.deep.equal([]);
     });
 
+    it('should prepare URL correctly', () => {
+      const ops: ApiOperation[] = [
+        {
+          operationId: 'get1',
+          method: 'get',
+          path: '/pet/{petId}',
+          responses: {},
+          group: null,
+        },
+        {
+          operationId: 'get2',
+          method: 'get',
+          path: '/users/{userId}/Wrong{/Path}',
+          parameters: [],
+          responses: {},
+          group: null,
+        },
+        {
+          operationId: 'get3',
+          method: 'get',
+          path: '/users/{}/Wrong{',
+          parameters: [],
+          responses: {},
+          group: null,
+        },
+      ];
+
+      const [op1, op2, op3] = prepareOperations(ops, opts);
+
+      expect(op1.url).to.equal('/pet/${encodeURIComponent(`${petId}`)}');
+      expect(op2.url).to.equal('/users/${encodeURIComponent(`${userId}`)}/Wrong{/Path}');
+      expect(op3.url).to.equal('/users/{}/Wrong{');
+    });
+
     describe('requestBody (JSON)', () => {
       it('should handle requestBody with ref type', () => {
         const ops: ApiOperation[] = [

src/gen/genOperations.ts

@@ -90,16 +90,28 @@ export function prepareOperations(
       responseContentType,
       method: op.method.toUpperCase(),
       name: getOperationName(op.operationId, op.group),
-      url: op.path,
+      url: prepareUrl(op.path),
       parameters: params,
       query: queryParams,
-      pathParams: getParams(op.parameters as OA3.ParameterObject[], options, ['path']),
       body,
       headers: getParams(op.parameters as OA3.ParameterObject[], options, ['header']),
     };
   });
 }
 
+/**
+ * This function will replace path template expressions with ${encodeURIComponent('paramName')} placeholders
+ * The end result will be a string that is effectively a template (i.e. you should wrap end result with backticks)
+ * This method is not really safe, but it will point out the potential issues with the path template expressions
+ * So that the developer can see actual problem in the compiled code (as opposed to having a runtime issues)
+ */
+function prepareUrl(path: string): string {
+  return path.replace(
+    /{([^}/]+)}/g,
+    (_, paramName) => `\${encodeURIComponent(\`\${${paramName}}\`)}`
+  );
+}
+
 /**
  * Let's add numbers to the duplicated operation names to avoid breaking code.
  * Duplicated operation names are not allowed by the OpenAPI spec, but in the real world
@@ -209,7 +221,6 @@ interface IOperation {
   url: string;
   parameters: IOperationParam[];
   query: IOperationParam[];
-  pathParams: IOperationParam[];
   body: IBodyParam;
   headers: IOperationParam[];
 }

src/utils/templateManager.spec.ts

@@ -53,8 +53,8 @@ describe('render', () => {
           parameters: [],
           name: 'TestName',
           returnType: 'string',
+          responseContentType: 'json',
           url: 'api/test',
-          pathParams: [],
           method: 'GET',
           formData: [],
           body: null,

templates/axios/operation.ejs

@@ -9,12 +9,7 @@
     <% }); %>
 $config?: AxiosRequestConfig
   ): AxiosPromise<<%~ it.returnType %>> {
-    let url = '<%= it.url %>';
-<% if(it.pathParams && it.pathParams.length > 0) {
-  it.pathParams.forEach((parameter) => { %>
-    url = url.replace('{<%= parameter.name %>}', encodeURIComponent(`${<%= parameter.name %>}`));
-<% });
-} %>
+    const url = `<%= it.url %>`;
 
     return axios.request<<%~ it.returnType %>>({
       url: url,

templates/fetch/operation.ejs

@@ -10,11 +10,6 @@
 $config?: RequestInit
   ): Promise<<%~ it.returnType %>> {
     let url = `${defaults.baseUrl}<%= it.url %>?`;
-<% if(it.pathParams && it.pathParams.length > 0) {
-  it.pathParams.forEach((parameter) => { %>
-    url = url.replace('{<%= parameter.name %>}', encodeURIComponent(`${<%= parameter.name %>}`));
-<% });
-} %>
 <% if(it.query && it.query.length > 0) { %>
   <% it.query.forEach((parameter) => { %>
   if (<%= parameter.name %> !== undefined) {

templates/ng1/operation.ejs

@@ -10,12 +10,7 @@
     <% }); %>
     config?: IRequestShortcutConfig
   ): IPromise<<%~ it.returnType %>> {
-    let url = '<%= it.url %>?';
-<% if(it.pathParams && it.pathParams.length > 0) {
-  it.pathParams.forEach((parameter) => { %>
-    url = url.replace('{<%= parameter.name %>}', encodeURIComponent(`${<%= parameter.name %>}`));
-<% });
-} %>
+    let url = `<%= it.url %>?`;
 <% if(it.query && it.query.length > 0) { %>
   <% it.query.forEach((parameter) => { %>
   if (<%= parameter.name %> !== undefined) {

templates/ng2/operation.ejs

@@ -11,12 +11,7 @@
     <% }); %>
 config?: any
   ): Observable<<%~ it.returnType %>> {
-    let url = '<%= it.url %>?';
-<% if(it.pathParams && it.pathParams.length > 0) {
-  it.pathParams.forEach((parameter) => { %>
-    url = url.replace('{<%= parameter.name %>}', encodeURIComponent(`${<%= parameter.name %>}`));
-<% });
-} %>
+    let url = `<%= it.url %>?`;
 <% if(it.query && it.query.length > 0) { %>
   <% it.query.forEach((parameter) => { %>
   if (<%= parameter.name %> !== undefined && <%= parameter.name %> !== null) {

templates/swr-axios/operation.ejs

@@ -9,13 +9,7 @@
     <% }); %>
   $config?: AxiosRequestConfig
   ): AxiosPromise<<%~ it.returnType %>> {
-    let url = '<%= it.url %>';
-
-<% if(it.pathParams && it.pathParams.length > 0) {
-  it.pathParams.forEach((parameter) => { %>
-    url = url.replace('{<%= parameter.name %>}', encodeURIComponent(`${<%= parameter.name %>}`));
-<% });
-} %>
+    const url = `<%= it.url %>`;
 
     return axios.request<<%~ it.returnType %>>({
       url: url,

templates/swr-axios/swrOperation.ejs

@@ -9,15 +9,9 @@ export function <%= it.swrOpName %>(<% it.parameters.forEach((parameter) => { %>
     <% }); %>
   $config?: SwrConfig
   ) {
-  let url = '<%= it.url %>';
+  const url = `<%= it.url %>`;
   const { axios: $axiosConf, key, ...config } = $config || {};
 
-<% if(it.pathParams && it.pathParams.length > 0) {
-  it.pathParams.forEach((parameter) => { %>
-  url = url.replace('{<%= parameter.name %>}', encodeURIComponent(`${<%= parameter.name %>}`));
-<% });
-} %>
-
   let cacheUrl = url + '?';
 <% if(it.query && it.query.length > 0) { %>
   <% it.query.forEach((parameter) => { %>

templates/xior/barrel.ejs

@@ -4,7 +4,7 @@ function serializeQueryParam(obj: any) {
   if (obj instanceof Date) return obj.toJSON();
   if (typeof obj !== 'object' || Array.isArray(obj)) return obj;
   return Object.keys(obj)
-    .reduce((a: any, b) => a.push(b + '=' + obj[b]) && a, [])
+    .reduce((a: any, b) => a.push(`${b}=${obj[b]}`) && a, [])
     .join('&');
 }
 

templates/xior/operation.ejs

@@ -9,12 +9,7 @@
     <% }); %>
 $config?: XiorRequestConfig
   ): Promise<XiorResponse<<%~ it.returnType %>>> {
-    let url = '<%= it.url %>';
-<% if(it.pathParams && it.pathParams.length > 0) {
-  it.pathParams.forEach((parameter) => { %>
-    url = url.replace('{<%= parameter.name %>}', encodeURIComponent(`${<%= parameter.name %>}`));
-<% });
-} %>
+    const url = `<%= it.url %>`;
 
     return http.request<<%~ it.returnType %>>({
       url: url,

test/snapshots/axios.ts

@@ -22,7 +22,7 @@ export const petClient = {
   addPet(body: Pet ,
     $config?: AxiosRequestConfig
   ): AxiosPromise<Pet> {
-    let url = '/pet';
+    const url = `/pet`;
 
     return axios.request<Pet>({
       url: url,
@@ -40,8 +40,7 @@ export const petClient = {
     petId: number ,
     $config?: AxiosRequestConfig
   ): AxiosPromise<unknown> {
-    let url = '/pet/{petId}';
-    url = url.replace('{petId}', encodeURIComponent(`${petId}`));
+    const url = `/pet/${encodeURIComponent(`${petId}`)}`;
 
     return axios.request<unknown>({
       url: url,
@@ -59,7 +58,7 @@ export const petClient = {
   findPetsByStatus(status: ("available" | "pending" | "sold") | null | undefined,
     $config?: AxiosRequestConfig
   ): AxiosPromise<Pet[]> {
-    let url = '/pet/findByStatus';
+    const url = `/pet/findByStatus`;
 
     return axios.request<Pet[]>({
       url: url,
@@ -77,7 +76,7 @@ export const petClient = {
   findPetsByTags(tags: string[] | null | undefined,
     $config?: AxiosRequestConfig
   ): AxiosPromise<Pet[]> {
-    let url = '/pet/findByTags';
+    const url = `/pet/findByTags`;
 
     return axios.request<Pet[]>({
       url: url,
@@ -95,8 +94,7 @@ export const petClient = {
   getPetById(petId: number ,
     $config?: AxiosRequestConfig
   ): AxiosPromise<Pet> {
-    let url = '/pet/{petId}';
-    url = url.replace('{petId}', encodeURIComponent(`${petId}`));
+    const url = `/pet/${encodeURIComponent(`${petId}`)}`;
 
     return axios.request<Pet>({
       url: url,
@@ -111,7 +109,7 @@ export const petClient = {
   updatePet(body: Pet ,
     $config?: AxiosRequestConfig
   ): AxiosPromise<Pet> {
-    let url = '/pet';
+    const url = `/pet`;
 
     return axios.request<Pet>({
       url: url,
@@ -131,8 +129,7 @@ export const petClient = {
     status: string | null | undefined,
     $config?: AxiosRequestConfig
   ): AxiosPromise<unknown> {
-    let url = '/pet/{petId}';
-    url = url.replace('{petId}', encodeURIComponent(`${petId}`));
+    const url = `/pet/${encodeURIComponent(`${petId}`)}`;
 
     return axios.request<unknown>({
       url: url,
@@ -155,8 +152,7 @@ export const petClient = {
     additionalMetadata: string | null | undefined,
     $config?: AxiosRequestConfig
   ): AxiosPromise<File> {
-    let url = '/pet/{petId}/uploadImage';
-    url = url.replace('{petId}', encodeURIComponent(`${petId}`));
+    const url = `/pet/${encodeURIComponent(`${petId}`)}/uploadImage`;
 
     return axios.request<File>({
       url: url,
@@ -178,8 +174,7 @@ export const storeClient = {
   deleteOrder(orderId: number ,
     $config?: AxiosRequestConfig
   ): AxiosPromise<unknown> {
-    let url = '/store/order/{orderId}';
-    url = url.replace('{orderId}', encodeURIComponent(`${orderId}`));
+    const url = `/store/order/${encodeURIComponent(`${orderId}`)}`;
 
     return axios.request<unknown>({
       url: url,
@@ -192,7 +187,7 @@ export const storeClient = {
    */
   getInventory($config?: AxiosRequestConfig
   ): AxiosPromise<{ [key: string]: number }> {
-    let url = '/store/inventory';
+    const url = `/store/inventory`;
 
     return axios.request<{ [key: string]: number }>({
       url: url,
@@ -207,8 +202,7 @@ export const storeClient = {
   getOrderById(orderId: number ,
     $config?: AxiosRequestConfig
   ): AxiosPromise<Order> {
-    let url = '/store/order/{orderId}';
-    url = url.replace('{orderId}', encodeURIComponent(`${orderId}`));
+    const url = `/store/order/${encodeURIComponent(`${orderId}`)}`;
 
     return axios.request<Order>({
       url: url,
@@ -223,7 +217,7 @@ export const storeClient = {
   placeOrder(body: Order | null | undefined,
     $config?: AxiosRequestConfig
   ): AxiosPromise<Order> {
-    let url = '/store/order';
+    const url = `/store/order`;
 
     return axios.request<Order>({
       url: url,
@@ -242,7 +236,7 @@ export const userClient = {
   createUser(body: User | null | undefined,
     $config?: AxiosRequestConfig
   ): AxiosPromise<User> {
-    let url = '/user';
+    const url = `/user`;
 
     return axios.request<User>({
       url: url,
@@ -258,7 +252,7 @@ export const userClient = {
   createUsersWithListInput(body: User[] | null | undefined,
     $config?: AxiosRequestConfig
   ): AxiosPromise<User> {
-    let url = '/user/createWithList';
+    const url = `/user/createWithList`;
 
     return axios.request<User>({
       url: url,
@@ -274,8 +268,7 @@ export const userClient = {
   deleteUser(username: string ,
     $config?: AxiosRequestConfig
   ): AxiosPromise<unknown> {
-    let url = '/user/{username}';
-    url = url.replace('{username}', encodeURIComponent(`${username}`));
+    const url = `/user/${encodeURIComponent(`${username}`)}`;
 
     return axios.request<unknown>({
       url: url,
@@ -290,8 +283,7 @@ export const userClient = {
   getUserByName(username: string ,
     $config?: AxiosRequestConfig
   ): AxiosPromise<User> {
-    let url = '/user/{username}';
-    url = url.replace('{username}', encodeURIComponent(`${username}`));
+    const url = `/user/${encodeURIComponent(`${username}`)}`;
 
     return axios.request<User>({
       url: url,
@@ -308,7 +300,7 @@ export const userClient = {
     password: string | null | undefined,
     $config?: AxiosRequestConfig
   ): AxiosPromise<string> {
-    let url = '/user/login';
+    const url = `/user/login`;
 
     return axios.request<string>({
       url: url,
@@ -325,7 +317,7 @@ export const userClient = {
    */
   logoutUser($config?: AxiosRequestConfig
   ): AxiosPromise<unknown> {
-    let url = '/user/logout';
+    const url = `/user/logout`;
 
     return axios.request<unknown>({
       url: url,
@@ -342,8 +334,7 @@ export const userClient = {
     username: string ,
     $config?: AxiosRequestConfig
   ): AxiosPromise<unknown> {
-    let url = '/user/{username}';
-    url = url.replace('{username}', encodeURIComponent(`${username}`));
+    const url = `/user/${encodeURIComponent(`${username}`)}`;
 
     return axios.request<unknown>({
       url: url,