Fix tooltips with Tippy.js #120

janfaracik · 2022-05-02T13:11:17Z

This PR fixes tooltips for Jenkins #6408 which replaces YUI tooltips with Tippy.js ones.

Essentially the fix is to reregister the tooltips once a new item has been added otherwise Tippy won't know about the new element.

Thanks @timja :)

Make sure you are opening from a topic/feature/bugfix branch (right side) and not your main branch!
Ensure that the pull request title represents the desired changelog entry
Please describe what you did
Link to relevant issues in GitHub or Jira
Link to relevant pull requests, esp. upstream and downstream changes
Ensure you have provided tests - that demonstrates feature works or fixes the issue

timja

I tested on 2.277.1 and with jenkinsci/jenkins#6408

Works fine and looks much better with the new core PR

daniel-beck · 2022-05-02T19:44:14Z

Is this a side effect of the new non-HTML by default behavior? If so, how do I prevent XSS on old Jenkins and get sane tooltips on new Jenkins? Would window.registerTooltips be how I check for the presence of Tippy?

timja · 2022-05-02T19:51:23Z

Would window.registerTooltips be how I check for the presence of Tippy?

Yes

If so, how do I prevent XSS on old Jenkins and get sane tooltips on new Jenkins

Use html-tooltip if you want HTML, although not sure if f:checkbox will expose it currently

daniel-beck

Checking and unchecking a checkbox takes seconds to apply. There needs to be a better solution than this.

Weird, not reproducible right now

daniel-beck

Checking and unchecking a checkbox takes seconds to apply. There needs to be a better solution than this.

(I forgot that I restarted with 2.345 rather than the incremental, so everything was fast 😑)

src/main/java/org/jenkinsci/plugins/matrixauth/AuthorizationContainerDescriptor.java

src/main/resources/hudson/security/table.js

timja · 2022-05-02T22:27:18Z

src/main/resources/hudson/security/GlobalMatrixAuthorizationStrategy/config.jelly

-            data-message-empty="${%groupEmpty}"
-            data-message-error="${%groupError}"
-      />
+      <div class="jenkins-!-margin-top-2">


minor spacing fix, can extract if needed

Is this CSS class one that I can rely on existing in the future?

Yes it's a stable API, documented at:
https://weekly.ci.jenkins.io/design-library/Spacing/

timja · 2022-05-02T22:27:41Z

src/main/resources/hudson/security/GlobalMatrixAuthorizationStrategy/config.jelly

+        <f:helpLink featureName="${%Permissions matrix}" url="${descriptor.find('hudson.security.GlobalMatrixAuthorizationStrategy$DescriptorImpl').getHelpFile('user-group')}"/>
+        <f:helpArea />


fixes display of help link if ambiguous warning is on the page

daniel-beck · 2022-05-03T05:33:57Z

Nice, the current state no longer opens the browser built-in tooltip after clicking a checkbox.

Is it necessary to have the tooltips interactable? With a grid like matrix-auth's, it's annoying to move the pointer up and rather than disappear and allowing me to interact with the row of checkboxes, the tooltip is now itself the hovered element (and I can select text etc. from it).

timja · 2022-05-03T05:45:13Z

Is it necessary to have the tooltips interactable?

hmm on the demo on https://atomiks.github.io/tippyjs/ it doesn't do that, looking

I assume it's the interactive: true, in the tooltips.js file

For some reason only the html ones are interactive

src/main/resources/hudson/security/GlobalMatrixAuthorizationStrategy/config.jelly

timja · 2022-05-03T05:54:07Z

I assume it's the interactive: true, in the tooltips.js file

tested and yes it's that, it behaves how you expect without it, asked on https://github.com/jenkinsci/jenkins/pull/6408/files#r863493271

…into fix-tippy

timja · 2022-05-10T09:51:05Z

@daniel-beck any chance of another review please, thanks!

janfaracik · 2022-05-26T19:16:04Z

Heya @daniel-beck, any update on this? Cheers :)

daniel-beck · 2022-05-31T08:59:03Z

TIL this is blocking the core fix. Sorry about that.

daniel-beck · 2022-12-08T10:18:43Z

Would window.registerTooltips be how I check for the presence of Tippy?

Yes

That didn't survive a code reorg in the core PR: #130 (comment)

daniel-beck · 2023-09-15T19:24:37Z

src/main/resources/hudson/security/table.js

+  if (window.registerTooltips) {
+    window.registerTooltips(e.nextSibling.parentElement);
+  }


What was the purpose of this? It doesn't work since jenkinsci/jenkins#7464 renamed the method, and the other occurrence of registerTooltips was fixed up in #130, but this code still exists.

I think it was fixed in core itself with behaviour and then applying subtree here.

the purpose was so that when checkboxes were dynamically added they would have tippy run on this but it was fixed in another way...

Fix Tippy

ab3c76f

janfaracik mentioned this pull request May 2, 2022

Forward compatibility for tippy jenkinsci/acceptance-test-harness#759

Merged

timja approved these changes May 2, 2022

View reviewed changes

timja requested a review from daniel-beck May 2, 2022 14:42

daniel-beck previously requested changes May 2, 2022

View reviewed changes

daniel-beck requested changes May 2, 2022

View reviewed changes

Mostly working

b58dfc0

timja reviewed May 2, 2022

View reviewed changes

src/main/java/org/jenkinsci/plugins/matrixauth/AuthorizationContainerDescriptor.java Outdated Show resolved Hide resolved

timja reviewed May 2, 2022

View reviewed changes

src/main/resources/hudson/security/table.js Outdated Show resolved Hide resolved

timja marked this pull request as draft May 2, 2022 20:56

timja added 3 commits May 2, 2022 22:46

Fix type display

e813f76

Check tippy is present

b9fd5e8

Cleanup code

2affb40

timja marked this pull request as ready for review May 2, 2022 22:19

timja requested a review from daniel-beck May 2, 2022 22:19

timja added 2 commits May 2, 2022 23:25

More compatibility

086da9d

Consistency

f113e78

timja reviewed May 2, 2022

View reviewed changes

Fix tooltips for permission descriptions

09616bb

daniel-beck reviewed May 3, 2022

View reviewed changes

src/main/resources/hudson/security/GlobalMatrixAuthorizationStrategy/config.jelly Show resolved Hide resolved

timja mentioned this pull request May 3, 2022

Replace YUI tooltips with Tippy.js jenkinsci/jenkins#6408

Merged

11 tasks

html-tooltip forward compat

3a215df

daniel-beck mentioned this pull request May 3, 2022

Fix type in tooltip of newly added rows #121

Merged

daniel-beck and others added 3 commits May 3, 2022 21:55

Merge branch 'master' into fix-tippy

2e53b40

Use forward compat from core

0f8e594

Merge branch 'fix-tippy' of github.com:janfaracik/matrix-auth-plugin …

f97b3d4

…into fix-tippy

timja requested a review from daniel-beck May 7, 2022 11:16

timja mentioned this pull request May 10, 2022

Validation Form field Tooltip "Delete" hover is slow to disappear jenkinsci/design-library-plugin#53

Closed

NotMyFault approved these changes May 30, 2022

View reviewed changes

daniel-beck merged commit 047fce3 into jenkinsci:master Jun 22, 2022

janfaracik mentioned this pull request Jun 23, 2022

Fix Matrix Auth tests jenkinsci/acceptance-test-harness#795

Merged

6 tasks

daniel-beck mentioned this pull request Dec 8, 2022

[JENKINS-70231] Fix tooltips on 2.379+ #130

Merged

daniel-beck reviewed Sep 15, 2023

View reviewed changes

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Fix tooltips with Tippy.js #120

Fix tooltips with Tippy.js #120

janfaracik commented May 2, 2022

timja left a comment

daniel-beck commented May 2, 2022 •

edited

Loading

timja commented May 2, 2022 •

edited

Loading

daniel-beck left a comment •

edited

Loading

daniel-beck left a comment

timja May 2, 2022

daniel-beck May 3, 2022

timja May 3, 2022

timja May 2, 2022

daniel-beck commented May 3, 2022

timja commented May 3, 2022 •

edited

Loading

timja commented May 3, 2022

timja commented May 10, 2022

janfaracik commented May 26, 2022

daniel-beck commented May 31, 2022

daniel-beck commented Dec 8, 2022

daniel-beck Sep 15, 2023

timja Sep 16, 2023

		<f:helpLink featureName="${%Permissions matrix}" url="${descriptor.find('hudson.security.GlobalMatrixAuthorizationStrategy$DescriptorImpl').getHelpFile('user-group')}"/>
		<f:helpArea />

Fix tooltips with Tippy.js #120

Fix tooltips with Tippy.js #120

Conversation

janfaracik commented May 2, 2022

timja left a comment

Choose a reason for hiding this comment

daniel-beck commented May 2, 2022 • edited Loading

timja commented May 2, 2022 • edited Loading

daniel-beck left a comment • edited Loading

Choose a reason for hiding this comment

daniel-beck left a comment

Choose a reason for hiding this comment

timja May 2, 2022

Choose a reason for hiding this comment

daniel-beck May 3, 2022

Choose a reason for hiding this comment

timja May 3, 2022

Choose a reason for hiding this comment

timja May 2, 2022

Choose a reason for hiding this comment

daniel-beck commented May 3, 2022

timja commented May 3, 2022 • edited Loading

timja commented May 3, 2022

timja commented May 10, 2022

janfaracik commented May 26, 2022

daniel-beck commented May 31, 2022

daniel-beck commented Dec 8, 2022

daniel-beck Sep 15, 2023

Choose a reason for hiding this comment

timja Sep 16, 2023

Choose a reason for hiding this comment

daniel-beck commented May 2, 2022 •

edited

Loading

timja commented May 2, 2022 •

edited

Loading

daniel-beck left a comment •

edited

Loading

timja commented May 3, 2022 •

edited

Loading