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

1 files changed, 26 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, '*');
+  });
 };