Add latest changes from gitlab-org/security/gitlab@15-5-stable-ee

2 files changed, 69 insertions, 20 deletions

diff --git a/app/assets/javascripts/blob/openapi/index.js b/app/assets/javascripts/blob/openapi/index.js
index 44b75cc3e68..943001b7ec4 100644
--- a/app/assets/javascripts/blob/openapi/index.js
+++ b/app/assets/javascripts/blob/openapi/index.js
@@ -1,23 +1,29 @@
-import { SwaggerUIBundle } from 'swagger-ui-dist';
-import { createAlert } from '~/flash';
-import { __ } from '~/locale';
+import { setAttributes } from '~/lib/utils/dom_utils';
+import axios from '~/lib/utils/axios_utils';
 
-export default () => {
-  const el = document.getElementById('js-openapi-viewer');
+const createSandbox = () => {
+  const iframeEl = document.createElement('iframe');
+  setAttributes(iframeEl, {
+    src: '/-/sandbox/swagger',
+    sandbox: 'allow-scripts',
+    frameBorder: 0,
+    width: '100%',
+    // The height will be adjusted dynamically.
+    // Follow-up issue: https://gitlab.com/gitlab-org/gitlab/-/issues/377969
+    height: '1000',
+  });
+  return iframeEl;
+};
+
+export default async () => {
+  const wrapperEl = document.getElementById('js-openapi-viewer');
+  const sandboxEl = createSandbox();
+
+  const { data } = await axios.get(wrapperEl.dataset.endpoint);
+
+  wrapperEl.appendChild(sandboxEl);
 
-  Promise.all([import(/* webpackChunkName: 'openapi' */ 'swagger-ui-dist/swagger-ui.css')])
-    .then(() => {
-      SwaggerUIBundle({
-        url: el.dataset.endpoint,
-        dom_id: '#js-openapi-viewer',
-        deepLinking: true,
-        displayOperationId: true,
-      });
-    })
-    .catch((error) => {
-      createAlert({
-        message: __('Something went wrong while initializing the OpenAPI viewer'),
-      });
-      throw error;
-    });
+  sandboxEl.addEventListener('load', () => {
+    sandboxEl.contentWindow.postMessage(data, '*');
+  });
 };
diff --git a/app/assets/javascripts/lib/swagger.js b/app/assets/javascripts/lib/swagger.js
new file mode 100644
index 00000000000..ed646176604
--- /dev/null
+++ b/app/assets/javascripts/lib/swagger.js
@@ -0,0 +1,43 @@
+import { SwaggerUIBundle } from 'swagger-ui-dist';
+import { safeLoad } from 'js-yaml';
+import { isObject } from '~/lib/utils/type_utility';
+
+const renderSwaggerUI = (value) => {
+  /* SwaggerUIBundle accepts openapi definition
+   * in only JSON format, so we convert the YAML
+   * config to JSON if it's not JSON value
+   */
+  let spec = value;
+  if (!isObject(spec)) {
+    spec = safeLoad(spec, { json: true });
+  }
+
+  Promise.all([import(/* webpackChunkName: 'openapi' */ 'swagger-ui-dist/swagger-ui.css')])
+    .then(() => {
+      SwaggerUIBundle({
+        spec,
+        dom_id: '#swagger-ui',
+        deepLinking: true,
+        displayOperationId: true,
+      });
+    })
+    .catch((error) => {
+      throw error;
+    });
+};
+
+const addInitHook = () => {
+  window.addEventListener(
+    'message',
+    (event) => {
+      if (event.origin !== window.location.origin) {
+        return;
+      }
+      renderSwaggerUI(event.data);
+    },
+    false,
+  );
+};
+
+addInitHook();
+export default {};