Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Using module bundles of different products in one app breaks global bryntum query #1980

Closed
pmiklashevych opened this issue Nov 26, 2020 · 4 comments
Closed

Using module bundles of different products in one app breaks global bryntum query #1980

pmiklashevych opened this issue Nov 26, 2020 · 4 comments
Labels
bug Something isn't working forum Issues from forum premium
Milestone
5.0.0

Comments

@pmiklashevych
Copy link

pmiklashevych commented Nov 26, 2020 •
edited

Forum: https://www.bryntum.com/forum/viewtopic.php?p=79797#p79797
Testcase:
bryntumDemo.zip

  1. Try to query Gantt panel in the demo:
    http://lh/bryntum-suite/gantt/examples/gantt-schedulerpro/index.module.html
bryntum.query('gantt');
// Gantt {…}

Works because gantt's id is in bryntum.Widget.identifiable.idMap

  1. Add schedulerpro.module.js to the demo
    Gantt/examples/gantt-schedulerpro/index.module.html
<body>
	<div id="container">
	</div>
	<!-- Using Ecma Modules bundle -->
	<script src="../_shared/locales/examples.locales.umd.js"></script>
	<script data-default-locale="En" type="module" src="app.module.js"></script>
	<script type="module" src="../../../SchedulerPro/build/schedulerpro.module.js"></script>
</body>
  1. Try to query Gantt panel again:
bryntum.query('gantt');
// null

Doesn't work because gantt's id is not in bryntum.Widget.identifiable.idMap
bryntum.Widget of Gantt is overridden by the one from SchedulerPro bundle.
See Core/lib/Core/widget/Widget.js:4082

// Simplify querying widgets by exposing fns in bryntum ns
(window.bryntum || (window.bryntum = {})).get = Widget.getById.bind(Widget);
window.bryntum.Widget = Widget;
window.bryntum.query = Widget.query;
  1. To make sure change it this way:
// (window.bryntum || (window.bryntum = {})).get = Widget.getById.bind(Widget);
window.bryntum = window.bryntum || {};
window.bryntum._widgets = window.bryntum._widgets || [];
window.bryntum._widgets.push(Widget);
window.bryntum.get = Widget.getById.bind(Widget);

Build SchedulerPro and Gantt:
grunt schedulerpro:build-module
grunt gantt:build-module
Reload the page

bryntum._widgets
//(2) [ƒ, ƒ]
bryntum._widgets[0].getById('b-gantt-1')
//Gantt {…}
bryntum._widgets[0].query('gantt')
//Gantt {…}
bryntum.get('b-gantt-1')
//undefined
bryntum.query('gantt')
//null

Reproduced in simple demo by forcing the SchedulerPro import, but the real usecase is when you're trying to mix different products in framework application, for example in angular package.json:

    "bryntum-angular-shared": "file:./lib/gantt/dist/bryntum-angular-shared",
    "bryntum-gantt": "file:./lib/gantt/build",
    "@bryntum/schedulerpro-angular": "file:./lib/scheduler/dist/schedulerpro",
    "bryntum-schedulerpro": "file:./lib/scheduler/build",
@pmiklashevych pmiklashevych added the bug Something isn't working label Nov 26, 2020
@pmiklashevych
Copy link
Author

Also here viewPreset instanceof ViewPreset doesn't work because ViewPreset of Gantt and ViewPreset of SchedulerPro are different constructors!

    changeViewPreset(viewPreset, oldViewPreset) {
        const me = this;

        // Throw on use of expired deprecated usage.
        if (!(viewPreset instanceof ViewPreset) && viewPreset.name && !viewPreset.base) {
            throw new Error('ViewPreset name config replaced by base config...');
        }

@isglass isglass added this to the 4.0.4 milestone Nov 30, 2020
@isglass isglass modified the milestones: 4.0.4, 4.0.5, 4.0.6 Dec 9, 2020
@matsbryntse matsbryntse modified the milestones: 4.0.6, 4.0.7 Dec 29, 2020
@SergeyMaltsev SergeyMaltsev modified the milestones: 4.0.7, 4.0.8 Jan 12, 2021
@SergeyMaltsev SergeyMaltsev modified the milestones: 4.0.8, 4.1.1 Jan 26, 2021
@pmiklashevych pmiklashevych added forum Issues from forum premium labels Apr 6, 2021
@SergeyMaltsev SergeyMaltsev modified the milestones: 4.1.1, 4.1.2 Apr 23, 2021
@isglass isglass modified the milestones: 4.1.2, 4.1.3, 4.1.x Apr 27, 2021
@isglass
Copy link
Contributor

isglass commented May 3, 2021

Should be solved by #2805

@isglass isglass modified the milestones: 4.1.x, 5.0 May 3, 2021
@isglass isglass mentioned this issue May 3, 2021
Closed
6 tasks
@pmiklashevych
Copy link
Author

Another testcase
https://www.bryntum.com/forum/viewtopic.php?p=88622#p88622
bryntum-example.zip
npm i && npm run start
Open a column header menu on the grid. See it's broken. Submenu doesn't work and outside click doesn't hide it.
The reason in global widget registry. toWidget = GlobalEvents.Widget.fromElement(toElement) returns null.
Снимок экрана 2021-06-23 в 15 35 35

@matsbryntse matsbryntse modified the milestones: 5.0, 5.0.1 Feb 21, 2022
@matsbryntse
Copy link
Member

Fixed by using thin bundles.

@matsbryntse matsbryntse modified the milestones: 5.0.1, 5.0 Mar 2, 2022
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
bug Something isn't working forum Issues from forum premium
Projects
None yet
Milestone
5.0.0
Development

No branches or pull requests
4 participants
@matsbryntse @isglass @SergeyMaltsev @pmiklashevych