This is a migrated thread and some comments may be shown as answers.

Kendo and jQuery Validate fails after Chrome Update

8 Answers 193 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
IT
Top achievements
Rank 1
IT asked on 10 Jul 2017, 03:57 PM

My website was working fine till last week, during which there seems to have been a chrome update.

The issue is right when my page loads, we have a search field, but the cursor does not display, even after i click with mouse pointer on the text box. I am able to type and do search, but the cursor does not appear, which says there is something wrong.

But once inside, I have another masterpage and here there are few jQuery validations. But even after the user enters the required values, keep getting "Those values required" error message. We use jquery validate, but even after we tried kendo validator the same issue remains. I cannot proceed from this page.

Once i close the browser and come back, the issue seems to be resolved some time. But its very inconsistent and we cannot suggest that to production. FireFox has no issues, so its something related with Chrome.

If i am loading the page in developer mode (F12), there seems to be no issue too. This happens only in the deployed version and right after clearing the cache of the browser. It has to be do with some scripts not loading, but I am not able to test it since, all scripts are loaded and working when doing it in developer mode.

8 Answers, 1 is accepted

Sort by
0
Stefan
Telerik team
answered on 12 Jul 2017, 05:28 AM
Hello Team,

We made different testing scenarios, but unfortunately, the mentioned issue was not reproduced on my end:

http://dojo.telerik.com/iXoWu

We tested the jQuery validation as well and it was working as expected.

I used the following version of Chrome Version 59.0.3071.115 (Official Build) (64-bit) and cleared the browser cache as suggested.

As the issue seems very specific, could you please share with us a live URL of the deployed application which is reproducing the issue, and we will gladly investigate it.

Regards,
Stefan
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
IT
Top achievements
Rank 1
answered on 12 Jul 2017, 12:21 PM

Thanks for the reply. I cannot share the url, since its an internal application.

You can see the issue, if you have this page hosted at a server, such that when you access the page first time after clearing cache, it asks for your server authentication, after the authentication and when it lands on this page, for some reason the cursor is not displayed in the text box, even after you click on it. You can enter the text, the cursor not shown tells you there is something missing. You need something such that you land on this page after a server authentication. 

Its a chrome issue. I was able to replicate on a simple webpage with no kendo or jQuery, with just a text box and dropdown and hosting on server. For some reason there is something  that prevents from focus coming into the page and the controls. My solution in the actual application was to use a javascript alert , which the user is forced to click and then everything works as expected. But its super-annoying to show the javascript alert, eventhough i have to do it only once per session. Because if i use the kendo notifications, i still get stuck on the issue.

My real reason is not just the cursor missing, but in such an instance, once inside the application , i have few popup forms to collect user info and jQuery validate fails in those instances. Fails in the sense, even after having the required fields entered it still shows errors and would not allow to proceed.

I understand when you say you were not able to replicate, because i was not able to replicate the issue when this came up to me for the first time. And its only for the first time, after doing the server authentication . Which also means this has to be deployed to the server. I was not getting an issue when doing it locally, or even if i run the actual website in developer mode (F12).

0
IT
Top achievements
Rank 1
answered on 12 Jul 2017, 01:52 PM

When I access my website deployed on server, which has server authentication (not authenticated inside website, but checking LDAP and asking for you user network credentials to login like with Windows or Basic Authentication), as soon as you land on the first page, the cursor is missing on the textboxes, even after you manually click inside the textbox. I am able to enter text, but it cause some of the jQuery validations to fail at a later stage inside the application where we use pop-up form. It only happens in chrome. Firefox and IE does not have this issue. 

 

So if you want to replicate this, deploy a simple html page with a text box and drop down, into a different server/domain, which will prompt you to enter windows credentials for that domain and as soon as you land , you will see issue with text box. You have to clear browser cache before trying this, since this happens only the first time. I fixed the issue in the application by having a javascript alert on first page, but its not acceptable.

0
Stefan
Telerik team
answered on 13 Jul 2017, 06:53 AM
Hello Team,

Thank you for the additional information and details.

We were able to observe the described issue after following the suggested steps.

We tried different approaches and it is only fixed after changing a tap, opening the developer's tools or anything connected to the page focus, which we assume is the main issue.

Still, as this is reproducible on a page without Kendo UI on it, the Kendo UI team has no control over this behaviour as it is specific to the Chrome browser and how it is handling the focus of the DOM elements and the page itself.

If at any point the issue is fixed for regular input elements, but it is still observed in the Kendo UI controls, please let us know and we will gladly assist.

Regards,
Stefan
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data visualization (charts) and form elements.
0
IT
Top achievements
Rank 1
answered on 13 Jul 2017, 12:12 PM

Awesome... I am struggling to convince the members in the google chrome forums, since i cant provide a test link to our servers.

I guess you guys must have the resources to communicate this issue with Chrome , atleast provide them as a feedback so that it gets fixed in a future patch or something.

If you could let me know the link, I will also post the issue, so that someone looks at it.

I am just confused why no one else has this issue.

0
IT
Top achievements
Rank 1
answered on 13 Jul 2017, 12:20 PM
And is there a way to make this thread public so that others can follow this issue and I dont have to start explaining from scratch ?
0
Stefan
Telerik team
answered on 14 Jul 2017, 11:32 AM
Hello Team,

I made the thread public and it can be accessed on the following link:

http://www.telerik.com/forums/kendo-and-jquery-validate-fails-after-chrome-update

We also made a public page which can be used for testing and to demonstrate the issue:

http://dev.dimodi.com/chrome-focus/

User name: test
Password: test

This thread with the example and the explanation can be submitted as an issue to the Chrome team, and we hope that this will be enough confirmation for the existing issue.

Regards,
Stefan
Progress Telerik
Try our brand new, jQuery-free Angular 2 components built from ground-up which deliver the business app essential building blocks - a grid component, data (charts) and form elements.
0
IT
Top achievements
Rank 1
answered on 14 Jul 2017, 02:27 PM
Hi Stefan.. Super thanks for the support.
Tags
General Discussions
Asked by
IT
Top achievements
Rank 1
Answers by
Stefan
Telerik team
IT
Top achievements
Rank 1
Share this question
or