Skip to content

Commit 0f1f8e7

Browse files
dunglasdunglas
authored
Merge pull request #2076 from dunglas/fix-init-swagger-ui
Fix Swagger UI init
2 parents 0df2069 + 78b146f commit 0f1f8e7

File tree

1 file changed

+116
-108
lines changed

1 file changed

+116
-108
lines changed

‎src/Bridge/Symfony/Bundle/Resources/public/init-swagger-ui.js

Lines changed: 116 additions & 108 deletions
Original file line numberDiff line numberDiff line change
@@ -1,123 +1,131 @@
11
'use strict';
22

33
window.onload = () => {
4-
const data = JSON.parse(document.getElementById('swagger-data').innerText);
5-
const ui = SwaggerUIBundle({
6-
spec: data.spec,
7-
dom_id: '#swagger-ui',
8-
validatorUrl: null,
9-
presets: [
10-
SwaggerUIBundle.presets.apis,
11-
SwaggerUIStandalonePreset,
12-
],
13-
plugins: [
14-
SwaggerUIBundle.plugins.DownloadUrl,
15-
],
16-
layout: 'StandaloneLayout',
17-
});
18-
19-
if (data.oauth.enabled) {
20-
ui.initOAuth({
21-
clientId: data.oauth.clientId,
22-
clientSecret: data.oauth.clientSecret,
23-
realm: data.oauth.type,
24-
appName: data.spec.info.title,
25-
scopeSeparator: ' ',
26-
additionalQueryStringParams: {}
4+
const data = JSON.parse(document.getElementById('swagger-data').innerText);
5+
const ui = SwaggerUIBundle({
6+
spec: data.spec,
7+
dom_id: '#swagger-ui',
8+
validatorUrl: null,
9+
presets: [
10+
SwaggerUIBundle.presets.apis,
11+
SwaggerUIStandalonePreset,
12+
],
13+
plugins: [
14+
SwaggerUIBundle.plugins.DownloadUrl,
15+
],
16+
layout: 'StandaloneLayout',
2717
});
28-
}
2918

30-
window.ui = ui;
19+
if (data.oauth.enabled) {
20+
ui.initOAuth({
21+
clientId: data.oauth.clientId,
22+
clientSecret: data.oauth.clientSecret,
23+
realm: data.oauth.type,
24+
appName: data.spec.info.title,
25+
scopeSeparator: ' ',
26+
additionalQueryStringParams: {}
27+
});
28+
}
3129

32-
if (!data.operationId) return;
30+
window.ui = ui;
3331

34-
const observer = new MutationObserver(function (mutations, self) {
35-
const op = document.getElementById(`operations-${data.shortName}-${data.operationId}`);
36-
if (!op) return;
32+
if (!data.operationId) return;
3733

38-
self.disconnect();
34+
const opObserver = new MutationObserver(function (mutations, self) {
35+
const op = document.getElementById(`operations-${data.shortName}-${data.operationId}`);
36+
if (!op) return;
3937

40-
op.querySelector('.opblock-summary').click();
41-
op.querySelector('.try-out__btn').click();
38+
self.disconnect();
4239

43-
if (data.id) {
44-
const inputId = op.querySelector('.parameters input[placeholder="id"]');
45-
inputId.value = data.id;
46-
reactTriggerChange(inputId);
47-
}
40+
op.querySelector('.opblock-summary').click();
41+
const tryOutObserver = new MutationObserver(function (mutations, self) {
42+
const tryOut = op.querySelector('.try-out__btn');
43+
if (!tryOut) return;
4844

49-
for (const input of op.querySelectorAll('.parameters input')) {
50-
if (input.placeholder in data.queryParameters) {
51-
input.value = data.queryParameters[input.placeholder];
52-
reactTriggerChange(input);
53-
}
54-
}
45+
self.disconnect();
5546

56-
op.querySelector('.execute').click();
57-
op.scrollIntoView();
58-
});
59-
60-
observer.observe(document, {childList: true, subtree: true});
61-
62-
// Workaround for https://github.com/swagger-api/swagger-ui/issues/3028
63-
// Adapted from https://github.com/vitalyq/react-trigger-change/blob/master/lib/change.js
64-
// Copyright (c) 2017 Vitaly Kuznetsov
65-
// MIT License
66-
function reactTriggerChange(node) {
67-
// Do not try to delete non-configurable properties.
68-
// Value and checked properties on DOM elements are non-configurable in PhantomJS.
69-
function deletePropertySafe(elem, prop) {
70-
const desc = Object.getOwnPropertyDescriptor(elem, prop);
71-
if (desc && desc.configurable) {
72-
delete elem[prop];
73-
}
74-
}
47+
tryOut.click();
48+
if (data.id) {
49+
const inputId = op.querySelector('.parameters input[placeholder="id"]');
50+
inputId.value = data.id;
51+
reactTriggerChange(inputId);
52+
}
53+
54+
for (const input of op.querySelectorAll('.parameters input')) {
55+
if (input.placeholder in data.queryParameters) {
56+
input.value = data.queryParameters[input.placeholder];
57+
reactTriggerChange(input);
58+
}
59+
}
60+
61+
op.querySelector('.execute').click();
62+
op.scrollIntoView();
63+
});
64+
65+
tryOutObserver.observe(document, {childList: true, subtree: true});
66+
});
7567

76-
// React 16
77-
// Cache artificial value property descriptor.
78-
// Property doesn't exist in React <16, descriptor is undefined.
79-
const descriptor = Object.getOwnPropertyDescriptor(node, 'value');
80-
81-
// React 0.14: IE9
82-
// React 15: IE9-IE11
83-
// React 16: IE9
84-
// Dispatch focus.
85-
const focusEvent = document.createEvent('UIEvents');
86-
focusEvent.initEvent('focus', false, false);
87-
node.dispatchEvent(focusEvent);
88-
89-
// React 0.14: IE9
90-
// React 15: IE9-IE11
91-
// React 16
92-
// In IE9-10 imperative change of node value triggers propertychange event.
93-
// Update inputValueTracking cached value.
94-
// Remove artificial value property.
95-
// Restore initial value to trigger event with it.
96-
const initialValue = node.value;
97-
node.value = initialValue + '#';
98-
deletePropertySafe(node, 'value');
99-
node.value = initialValue;
100-
101-
// React 15: IE11
102-
// For unknown reason React 15 added listener for propertychange with addEventListener.
103-
// This doesn't work, propertychange events are deprecated in IE11,
104-
// but allows us to dispatch fake propertychange which is handled by IE11.
105-
const propertychangeEvent = document.createEvent('HTMLEvents');
106-
propertychangeEvent.initEvent('propertychange', false, false);
107-
propertychangeEvent.propertyName = 'value';
108-
node.dispatchEvent(propertychangeEvent);
109-
110-
// React 0.14: IE10-IE11, non-IE
111-
// React 15: non-IE
112-
// React 16: IE10-IE11, non-IE
113-
const inputEvent = document.createEvent('HTMLEvents');
114-
inputEvent.initEvent('input', true, false);
115-
node.dispatchEvent(inputEvent);
116-
117-
// React 16
118-
// Restore artificial value property descriptor.
119-
if (descriptor) {
120-
Object.defineProperty(node, 'value', descriptor);
68+
opObserver.observe(document, {childList: true, subtree: true});
69+
70+
// Workaround for https://github.com/swagger-api/swagger-ui/issues/3028
71+
// Adapted from https://github.com/vitalyq/react-trigger-change/blob/master/lib/change.js
72+
// Copyright (c) 2017 Vitaly Kuznetsov
73+
// MIT License
74+
function reactTriggerChange(node) {
75+
// Do not try to delete non-configurable properties.
76+
// Value and checked properties on DOM elements are non-configurable in PhantomJS.
77+
function deletePropertySafe(elem, prop) {
78+
const desc = Object.getOwnPropertyDescriptor(elem, prop);
79+
if (desc && desc.configurable) {
80+
delete elem[prop];
81+
}
82+
}
83+
84+
// React 16
85+
// Cache artificial value property descriptor.
86+
// Property doesn't exist in React <16, descriptor is undefined.
87+
const descriptor = Object.getOwnPropertyDescriptor(node, 'value');
88+
89+
// React 0.14: IE9
90+
// React 15: IE9-IE11
91+
// React 16: IE9
92+
// Dispatch focus.
93+
const focusEvent = document.createEvent('UIEvents');
94+
focusEvent.initEvent('focus', false, false);
95+
node.dispatchEvent(focusEvent);
96+
97+
// React 0.14: IE9
98+
// React 15: IE9-IE11
99+
// React 16
100+
// In IE9-10 imperative change of node value triggers propertychange event.
101+
// Update inputValueTracking cached value.
102+
// Remove artificial value property.
103+
// Restore initial value to trigger event with it.
104+
const initialValue = node.value;
105+
node.value = initialValue + '#';
106+
deletePropertySafe(node, 'value');
107+
node.value = initialValue;
108+
109+
// React 15: IE11
110+
// For unknown reason React 15 added listener for propertychange with addEventListener.
111+
// This doesn't work, propertychange events are deprecated in IE11,
112+
// but allows us to dispatch fake propertychange which is handled by IE11.
113+
const propertychangeEvent = document.createEvent('HTMLEvents');
114+
propertychangeEvent.initEvent('propertychange', false, false);
115+
propertychangeEvent.propertyName = 'value';
116+
node.dispatchEvent(propertychangeEvent);
117+
118+
// React 0.14: IE10-IE11, non-IE
119+
// React 15: non-IE
120+
// React 16: IE10-IE11, non-IE
121+
const inputEvent = document.createEvent('HTMLEvents');
122+
inputEvent.initEvent('input', true, false);
123+
node.dispatchEvent(inputEvent);
124+
125+
// React 16
126+
// Restore artificial value property descriptor.
127+
if (descriptor) {
128+
Object.defineProperty(node, 'value', descriptor);
129+
}
121130
}
122-
}
123131
};

0 commit comments

Comments
 (0)