Handle special characters on API request of issuable templates

app/assets/javascripts/api.js

@@ -178,7 +178,7 @@ const Api = {
   issueTemplate(namespacePath, projectPath, key, type, callback) {
     const url = Api.buildUrl(Api.issuableTemplatePath)
-      .replace(':key', key)
+      .replace(':key', encodeURIComponent(key))
       .replace(':type', type)
       .replace(':project_path', projectPath)
       .replace(':namespace_path', namespacePath);

changelogs/unreleased/40028-special-characters-on-issuable-templates.yml

+---
+title: Handle special characters on API request of issuable templates
+merge_request: 15323
+author: Takuya Noguchi
+type: fixed

config/routes/project.rb

@@ -40,7 +40,7 @@ constraints(ProjectUrlConstrainer.new) do
       #
       # Templates
       #
-      get '/templates/:template_type/:key' => 'templates#show', as: :template
+      get '/templates/:template_type/:key' => 'templates#show', as: :template, constraints: { key: /[^\/]+/ }
       resource  :avatar, only: [:show, :destroy]
       resources :commit, only: [:show], constraints: { id: /\h{7,40}/ } do

spec/javascripts/api_spec.js

@@ -262,9 +262,9 @@ describe('Api', () => {
     it('fetches an issue template', (done) => {
       const namespace = 'some namespace';
       const project = 'some project';
-      const templateKey = 'template key';
+      const templateKey = ' template #%?.key ';
       const templateType = 'template type';
-      const expectedUrl = `${dummyUrlRoot}/${namespace}/${project}/templates/${templateType}/${templateKey}`;
+      const expectedUrl = `${dummyUrlRoot}/${namespace}/${project}/templates/${templateType}/${encodeURIComponent(templateKey)}`;
       spyOn(jQuery, 'ajax').and.callFake((request) => {
         expect(request.url).toEqual(expectedUrl);
         return sendDummyResponse();