Commit 417d9544 authored by Andrew Fontaine's avatar Andrew Fontaine

Merge branch 'mg-remove-echarts-from-main-bundle' into 'master'

Remove eCharts and zrender from the main chunk

See merge request gitlab-org/gitlab!31435
parents fb9ced9a 88b00fae
import Vue from 'vue';
import EmbedGroup from '~/monitoring/components/embeds/embed_group.vue';
import { createStore } from '~/monitoring/stores/embed_group/';
// TODO: Handle copy-pasting - https://gitlab.com/gitlab-org/gitlab-foss/issues/64369.
export default function renderMetrics(elements) {
if (!elements.length) {
return;
return Promise.resolve();
}
const EmbedGroupComponent = Vue.extend(EmbedGroup);
const wrapperList = [];
elements.forEach(element => {
......@@ -31,14 +28,20 @@ export default function renderMetrics(elements) {
element.parentNode.removeChild(element);
});
wrapperList.forEach(wrapper => {
// eslint-disable-next-line no-new
new EmbedGroupComponent({
el: wrapper,
store: createStore(),
propsData: {
urls: wrapper.urls,
},
return import(
/* webpackChunkName: 'gfm_metrics' */ '~/monitoring/components/embeds/embed_group.vue'
).then(({ default: EmbedGroup }) => {
const EmbedGroupComponent = Vue.extend(EmbedGroup);
wrapperList.forEach(wrapper => {
// eslint-disable-next-line no-new
new EmbedGroupComponent({
el: wrapper,
store: createStore(),
propsData: {
urls: wrapper.urls,
},
});
});
});
}
......@@ -268,6 +268,22 @@ module.exports = {
minChunks: 2,
reuseExistingChunk: true,
},
echarts: {
priority: 14,
name: 'echarts',
chunks: 'all',
test: /[\\/]node_modules[\\/](echarts|zrender)[\\/]/,
minChunks: 2,
reuseExistingChunk: true,
},
security_reports: {
priority: 13,
name: 'security_reports',
chunks: 'initial',
test: /[\\/](vue_shared[\\/](security_reports|license_compliance)|security_dashboard)[\\/]/,
minChunks: 2,
reuseExistingChunk: true,
},
vendors: {
priority: 10,
chunks: 'async',
......
......@@ -11,20 +11,20 @@ const getElements = () => Array.from(document.getElementsByClassName('js-render-
describe('Render metrics for Gitlab Flavoured Markdown', () => {
it('does nothing when no elements are found', () => {
renderMetrics([]);
expect(mockEmbedGroup).not.toHaveBeenCalled();
return renderMetrics([]).then(() => {
expect(mockEmbedGroup).not.toHaveBeenCalled();
});
});
it('renders a vue component when elements are found', () => {
document.body.innerHTML = `<div class="js-render-metrics" data-dashboard-url="${TEST_HOST}"></div>`;
renderMetrics(getElements());
expect(mockEmbedGroup).toHaveBeenCalledTimes(1);
expect(mockEmbedGroup).toHaveBeenCalledWith(
expect.objectContaining({ propsData: { urls: [`${TEST_HOST}`] } }),
);
return renderMetrics(getElements()).then(() => {
expect(mockEmbedGroup).toHaveBeenCalledTimes(1);
expect(mockEmbedGroup).toHaveBeenCalledWith(
expect.objectContaining({ propsData: { urls: [`${TEST_HOST}`] } }),
);
});
});
it('takes sibling metrics and groups them under a shared parent', () => {
......@@ -36,14 +36,14 @@ describe('Render metrics for Gitlab Flavoured Markdown', () => {
<div class="js-render-metrics" data-dashboard-url="${TEST_HOST}/3"></div>
`;
renderMetrics(getElements());
expect(mockEmbedGroup).toHaveBeenCalledTimes(2);
expect(mockEmbedGroup).toHaveBeenCalledWith(
expect.objectContaining({ propsData: { urls: [`${TEST_HOST}/1`, `${TEST_HOST}/2`] } }),
);
expect(mockEmbedGroup).toHaveBeenCalledWith(
expect.objectContaining({ propsData: { urls: [`${TEST_HOST}/3`] } }),
);
return renderMetrics(getElements()).then(() => {
expect(mockEmbedGroup).toHaveBeenCalledTimes(2);
expect(mockEmbedGroup).toHaveBeenCalledWith(
expect.objectContaining({ propsData: { urls: [`${TEST_HOST}/1`, `${TEST_HOST}/2`] } }),
);
expect(mockEmbedGroup).toHaveBeenCalledWith(
expect.objectContaining({ propsData: { urls: [`${TEST_HOST}/3`] } }),
);
});
});
});
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment