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.

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

Update to jQuery UI 1.12 #3836

Merged
merged 4 commits into from
Sep 13, 2018
Merged

Update to jQuery UI 1.12 #3836

merged 4 commits into from
Sep 13, 2018

Conversation

cmd-ntrf
Copy link
Contributor

@cmd-ntrf cmd-ntrf commented Aug 8, 2018

Context

Jupyter Lmod is a notebook server extension that allows users to interact with environment modules before launching kernels. It adds a tab that includes a search bar that uses jQuery UI autocomplete.

Issue

PR #3655 updated the jQuery version to 3.3 and left jQuery UI version to 1.10. There are compatibility issues between these two versions that manifest in jupyter-lmod. The results proposed by autocomplete appears at the top of the page instead of under the search bar.

The following figure illustrates the bug.
buggy

This is the stacktrace generated by jquery in the javascript console.

Uncaught TypeError: r.getClientRects is not a function
    at w.fn.init.offset (jquery.min.js:2)
    at Object.getWithinInfo (jquery-ui.min.js:6)
    at w.fn.init.t.fn.position (jquery-ui.min.js:6)
    at t.(anonymous function).(anonymous function)._suggest (http://localhost:8888/static/components/jquery-ui/ui/minified/jquery-ui.min.js:6:33686)
    at t.(anonymous function).(anonymous function)._suggest (http://localhost:8888/static/components/jquery-ui/ui/minified/jquery-ui.min.js:6:5029)
    at t.(anonymous function).(anonymous function).__response (http://localhost:8888/static/components/jquery-ui/ui/minified/jquery-ui.min.js:6:33003)
    at t.(anonymous function).(anonymous function).__response (http://localhost:8888/static/components/jquery-ui/ui/minified/jquery-ui.min.js:6:5029)
    at t.(anonymous function).(anonymous function).e (http://localhost:8888/static/components/jquery-ui/ui/minified/jquery-ui.min.js:6:4913)
    at t.(anonymous function).(anonymous function).__response (http://localhost:8888/static/components/jquery-ui/ui/minified/jquery-ui.min.js:6:35170)
    at t.(anonymous function).(anonymous function).__response (http://localhost:8888/static/components/jquery-ui/ui/minified/jquery-ui.min.js:6:5029)

The following figure corresponds to the expected result using jQuery UI 1.12 with Jupyter notebook 5.6, or using previous version of Jupyter notebook.
correct

Proposed solution

Update jquery-ui to 1.12 in bower.json.

Disclaimer

I could not find the exact reason why jQuery UI 1.10 autocomplete does not work with jQuery 3.3. I came to the conclusion that jquery-ui had to be updated after reading the following answer on StackOverflow https://stackoverflow.com/a/50016548. I wish I had a better source.

@minrk minrk merged commit 9c60369 into jupyter:master Sep 13, 2018
@minrk minrk added this to the 5.7 milestone Sep 13, 2018
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Mar 30, 2021
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants