Bug report

Window's modal feature isn't working if there's an open Dialog.

Regression introduced with 2024.1.319

Reproduction of the problem

1. Open this Dojo example - https://dojo.telerik.com/uyUwAMeQ/2
2. Click the Open button inside the Dialog

Current behavior

The Window opened from the button isn't modal, and you can interact with the Dialog.

Expected/desired behavior

The Window should be modal as per the configuration.

Environment

• Kendo UI version: 2024.3.806
• Browser: [all]

Bug report

The Window themeColor configuration does not change the appearance of the component.

Reproduction of the problem

1. Open the Dojo - https://dojo.telerik.com/@NeliK/igOpetAW

Current behavior.

The Window colors are not changed.

Expected/desired behavior

The component appearance should be changed based on the configured value in themeColor.

Workaround

<style>
      .k-window-titlebar {
        color: var(--kendo-color-on-dark, #ffffff);
        background-color: var(--kendo-color-dark, #3d3d3d);
      }
</style>

Or

 $('.k-window').addClass('k-window-dark')

Environment

• Kendo UI version: 2024.2.514
• jQuery version: x.y
• Browser: [all ]

Bug report

If you attempt to close a Kendo Window from a Dialog action, an error is thrown on the console.

Regression introduced with 2024.1.319

Workaround: https://dojo.telerik.com/afUPoQuX/3

Reproduction of the problem

1. Open this Dojo example - https://dojo.telerik.com/afUPoQuX/2
2. Open the browser console
3. Click the OK action

Current behavior

An error is thrown on the console

Expected/desired behavior

No errors should be thrown

Environment

• Kendo UI version: 2024.1.319
• Browser: [all]

Bug report

Icons are missing in the components when a custom script is generated with Gulp

Reproduction of the problem

1. Follow the steps described in the link here - https://github.com/telerik/kendo-ui-core?tab=readme-ov-file#building-kendo-ui-core
2. Create a custom script for DropDownList or Window npx gulp custom -c window,dropdownlist
3. Try to load the script and create the components

Current behavior

The Window is missing the icons and the actions are not working. The DrpDownList works as expected, but the arrow icon is not visible

Expected/desired behavior

The components should work as expectedwhen custom scirpt is created

Environment

• Kendo UI version: 2024.1.130
• Browser: [all ]

Bug report

Window content remains when the visible configuration is set to false

Reproduction of the problem

1. Open the following dojo
2. Notice, that the Window's content remains initially visible in the DOM.

Current behavior

Currently, in order to avoid this behavior, an inline display:none style needs to be added to the window container. This does not convey however with CSP's Inline Styles convention.

Expected/desired behavior

It would be beneficial if the container can be wrapped with the k-hidden class and automatically detect it during the widget's initialization. This will bolster the CSP compliance for the Window widget and allow the customers to use inline classes instead.

Environment

• Kendo UI version: 2023.3.1114
• Browser: [all]

Bug report

When there are multiple modal windows on the page and the user tries to navigate using Tab key, the focus is not trapped in the window and elements on the browser become focused.

Reproduction of the problem

1. Open the Dojo example. https://dojo.telerik.com/@NeliKondova/iyULiwiQ
2. Press Tab key multiple times - the focus is always inside the window.
3. Click the openConfirmWindow button in the first modal window.
4. Close the second modal window.
5. Press Tab key multiple times.

Current behavior

When there is a second window on the page the focus is not trapped in the window and elements outside the window are focused.

Expected/desired behavior

The focus should be trapped in the window.

Environment

• Kendo UI version: 2023.2.606
• Browser: [all]

Hi

its not an urgent request as I implemented that feature already. However, I am not a good prgrammer and I would like to have this feature included by more skilled programmers.
Basically our GUI shows the data table as shown in the attached image. Now you can open quite a lot of floating windows and subwindows to work on the data. See second attachment. As this is sometimes confusing, we allow to dock/undock the windows on the left or right side of the table, depending on the relative position while clicking the dock button.

Kind regards

Alex

Bug report

The Grid Edit Window does not take all the space when maximized on mobile device with Android 12.

Reproduction of the problem

1. Open this example on a mobile device that has Android 12.
2. Scroll down to the bottom of the page.
3. Edit the last row.

Current behavior

The Window leaves some space at the bottom of the screen.

Video:
https://user-images.githubusercontent.com/20702110/197784930-bd867230-3815-4393-a201-ae3d10d1f718.mp4

Expected/desired behavior

The Window should take all the screen space

Environment

• Kendo UI version: 2022.3.913
• Browser: [Chrome on Android 12 mobile device]

Hi Team,

I'd like a way to configure the API so that the overlay which appears during resizing can be turned off. 

Thank you!

Hello,

I think i have found a potential bug

In the dojo below please run it and notice the window opens fine, then close and reopen it a couple of times.

The animation => open: false is causing the window to reopen at a smaller/zoomed out size. 

If you move the window it snaps to the correct size

https://dojo.telerik.com/oDuviZak/2

Bug report

The restore event is missing in the Window typescript definition

Reproduction of the problem

Open the typescript/kendo.all.d.ts file and search for kendo Window restore event

Expected/desired behavior

The restore event should be defined.

Environment

• Kendo UI version: 2022.2.510
• jQuery version: x.y
• Browser: [all]

Bug report

Upon opening the Window, the widget is not getting focused when using jQuery 3.6.0.

Reproduction of the problem

1. Open this Dojo example - https://dojo.telerik.com/@martin.tabakov@progress.com/EcIheNif/3

Current behavior

The Window is not focused upon opening.

Expected/desired behavior

The Window should be focused upon opening.

Environment

• Kendo UI version: 2021.3.914
• jQuery version: 3.6.0
• Browser: [all]

When opening a Window with modal and preventScroll: true on a page with scroll bars, the scroll position resets every time the window is opened and closed.

This is demonstrated in the Dojo example linked here. In the Dojo, scroll to the bottom and click the button to open the Window, the scroll position will change. 

Making the following modifications to the kendo.window.js file maintains the scroll position; would it be possible to add these modifications to a future release?

The code starts around line 912 of kendo.window.js

_stopDocumentScrolling: function () {
                var that = this;
                var containment = that.containment;
                if (containment && !that._isPinned) {
                    that._storeOverflowRule(containment);
                    containment.css(OVERFLOW, HIDDEN);
                    that.wrapper.css({
                        maxWidth: containment.innerWidth(),
                        maxHeight: containment.innerHeight()
                    });
                    return;
                }
                var $body = $('body');
                that._storeOverflowRule($body);
                $body.css(OVERFLOW, HIDDEN);
                // LSS: maintain scroll position when opening modal popup window
                var $html = $('html'),
                    scrollTop = $html.scrollTop();
                that._storeOverflowRule($html);
                $html.css(OVERFLOW, HIDDEN);
                // LSS: maintain scroll position when opening modal popup window
                $html.add($body).scrollTop(scrollTop);
            },
            _enableDocumentScrolling: function () {
                var that = this;
                var containment = that.containment;
                if (containment && !that._isPinned) {
                    that._restoreOverflowRule(containment);
                    that.wrapper.css({
                        maxWidth: containment.width,
                        maxHeight: containment.height
                    });
                    return;
                }
                that._restoreOverflowRule($(document.body));
                that._restoreOverflowRule($('html'));
            },
            _storeOverflowRule: function ($element) {
                if (this._isOverflowStored($element)) {
                    return;
                }
                var overflowRule = $element.get(0).style.overflow;
                if (typeof overflowRule === 'string') {
                    $element.data(DATADOCOVERFLOWRULE, overflowRule);
                    // LSS: maintain scroll position when opening modal popup window
                    $element.data('scrollTop', $element.scrollTop());
                }
            },
            _isOverflowStored: function ($element) {
                return typeof $element.data(DATADOCOVERFLOWRULE) === 'string';
            },
            _restoreOverflowRule: function ($element) {
                var overflowRule = $element.data(DATADOCOVERFLOWRULE);
                if (overflowRule !== null && overflowRule !== undefined) {
                    $element.css(OVERFLOW, overflowRule);
                    $element.removeData(DATADOCOVERFLOWRULE);
                    // LSS: maintain scroll position when opening modal popup window
                    var scrollTop = $element.data('scrollTop')
                    $element.scrollTop(scrollTop)
                    $element.removeData('scrollTop');
                } else {
                    $element.css(OVERFLOW, '');
                }
 },

Bug report

Regression introduced in R3 2020 SP1.

If the configured width of the Window exceeds the viewport width and animation is configured, the animation of the Window is broken.

Reproduction of the problem

Run the Dojo example and click the button

Note: If the issue is not replicated try to decrease the visible area.

Current behavior

The animation seems broken (screencast)

Expected/desired behavior

The Window should slide properly no matter of its width.

Environment

• Kendo UI version: 2020.3.1021
• Browser: [all ]

Bug report

Clicking inside the content of a modal Window with an iframe and then closing the Window does not remove the k-state-focused class from the Window wrapper.

Reproduction of the problem

1. Run this dojo
2. Click the Open Window button
3. Click inside to content of the Window
4. Close the Window

Current behavior

The window widget wrapper still has a k-state-focused class:

<div class="k-widget k-window k-state-focused" data-role="draggable" style="visibility: visible; display: none; padding-top: 45px; min-width: 90px; min-height: 50px; z-index: 10004; transform: scale(0.7);">
...
</div>

Expected/desired behavior

k-state-focused class should be removed upon closing of the Window

Environment

• Kendo UI version: 2020.3.915
• Browser: [all]

Bug report

When using Kendo Bootstrap v4 theme and attempting to display a maximized Kendo Window with iFrame content the iFrame does not take up the full height of the Kendo Window.
The behavior is observed with Safari browser on MacOS X or iOS

Reproduction of the problem

1. Run this dojo with Bootstrap-v4 bug example

Expected/desired behavior

The iFrame should take up the full height of the Kendo Window.

Adding the following style resolves the observed behavior:

<style type="text/css">
    .k-window-content.k-window-iframecontent {
        height:100%;
    }
</style>

Environment

• Kendo UI version: 2020.2.513
• Browser: [Safari | iOS Safari]

Bug report

When there are multiple Window components initialized in one page the initially defined z-index is not changing when tapping on a given Window on an iPad device in the Safari browser.

Reproduction of the problem

1. Open this Dojo example on an iPad
2. Drag the upper Window(Number 3) aside and tap on the second one

Possible fix
Replace:
wrapper.add(wrapper.children('.k-resize-handle,' + KWINDOWTITLEBAR)).on('mousedown' + NS, proxy(that.toFront, that));

With

wrapper.add(wrapper.children('.k-resize-handle,' + KWINDOWTITLEBAR)).on('mousedown' + NS, proxy(that.toFront, that)).on('touchstart' + NS, proxy(that.toFront, that));

Current behavior

The second Window continues to stay under window number 3

Expected/desired behavior

Once a given Window is tapped its should pop to the top and its content shouldn't be hidden by other Windows.

• Open the linked above Dojo project in Chrome for iPad and see the correct behavior

Environment

• Kendo UI version: 2019.3.1023
• jQuery version: x.y
• Browser: [iOS 13.2 Safari ]