When editing a tree, can not remove entries due to CSS bug

[PE1NUT]

Deleting items from the tree management interface is not possible when right-clicking, because the menu ends up underneath the existing entries. See attached picture.

Cacti is version 1.2.7 from Debian Testing.

Desktop is Ubuntu 19.04, with Firefox 69.0.2
The same issue happens with Firefox 69.0.2 on OSX 10.12.6
The same issue also happens with Safari 12.1.2 on OSX 10.12.6

[bmfmancini]

I am not seeing the same thing also on 1.2.7

I am using firefox 58.0.2

[netniV]

@bmfmancini if you have the 1.2.x branch, you are technically on 1.2.7+dev which is < 1.2.8 but on its way there 👍

I do believe that this was addressed by someone else raising the issue already, check though the issues since 1.2.7 and you will likely see the fix being applied.

[cigamit]

If you installed this from apg-get, then I suggest you log a Debian packaging bug as it's not a core cacti bug. Just adding @paulgevers to the thread in case.

[PE1NUT]

Confirmed as a Debian/Ubuntu bug:

When installing the Cacti 1.2.2 package on my Ubuntu 19.04 desktop, it has the same bug
Installing Cacti 1.2.7 from source on the same machine does -not- have the same bug. I'll try to figure out the differences, and report the results Debian/Ubuntu.

[PE1NUT]

In Issue #2988 this is addressed by a small edit to the CSS for the 'modern theme'. Making this change suggested in that issue works for me. However, that must not be the actual root cause, because the change in question (setting z-index to 99 for .vakata-context ul) is not part of the version in Github.

[paulgevers]

@PE1NUT can you elaborate what you did exactly? In Debian we don't use the theme files provided by Cacti, but link to the system version of jstree.

I think I need to start building a check for Cacti modifications to those files. However, it would be awesome if Cacti would just ship unmodified files and instead overload stuff in main.css.

[cigamit]

Thanks for the confirmation @paulgevers. Let's keep this open then.

[PE1NUT]

@paulgevers The simplest way to reproduce the issue is:

1. Install Cacti from Debian or Ubuntu pacakges
   Specifically, I did this on a Ubuntu 19.04 machine, which installed package cacti-1.2.2+ds1-2.
2. Add a few graphs to the cacti tree.
3. Try to right-click to remove one of the entries - this results in the screenshot shown above.

On the same machine, I built and installed cacti from source, after removing the packaged install.
git clone https://github.com/cacti/cacti
git checkout release/1.2.2
Install cacti by moving it to /var/www/html/cacti

Then, when adding the same graphs to the tree, and removing one, there is no issue.

I've ran a diff between the git version of release/1.2.2 and the contents of the Ubuntu 1.2.2 source package. To stop it from alerting on every file, I reverse-applied the Debian patches before running the diff. The main difference I noticed (ignoring translation files) is that a lot of jquery files are indeed missing in the Debian source package, as they are packaged separately on Debian. As the Debian system version of e.g. The jquery files that are in the Debian pacakge, are (according to diff) identical to the ones that are in the github release/1.2.2.

Our production cacti since a recent upgrade (from 0.8.x) runs on Debian Buster, and I installed (using pinning) the 1.2.7 Debian package from testing, as I had too many issues with earlier versions. In the Debian package version 1.2.7, the tree menu bug still exists. I applied the workaround suggested in #2988 as a stopgap until we can fully figure out what's breaking things.

[paulgevers]

Hi PE1NUT,

On 21-10-2019 19:41, PE1NUT wrote: @paulgevers <https://github.com/paulgevers> The simplest way to reproduce the issue is: 1. Install Cacti from Debian or Ubuntu pacakges Specifically, I did this on a Ubuntu 19.04 machine, which installed package cacti-1.2.2+ds1-2. 2. Add a few graphs to the cacti tree. 3. Try to right-click to remove one of the entries - this results in the screenshot shown above.

Thanks, I was able to reproduce this earlier already.

Our production cacti since a recent upgrade (from 0.8.x) runs on Debian Buster, and I installed (using pinning) the 1.2.7 Debian package from testing, as I had too many issues with earlier versions. In the Debian package version 1.2.7, the tree menu bug still exists. I applied the workaround suggested in #2988 <#2988> as a stopgap until we can fully figure out what's breaking things.

I was referring to this text. What exactly did you do and in which file? Paul

[PE1NUT]

Ah, gotcha. I implemented what was suggested in this comment, to a very similar bug:
#2988 (comment)

Which is indeed quite cryptic, but amounts to this 'hack':
(Edit: put code tags around it)

--- a/libjs-jquery-jstree-3.3.7+dfsg1/src/themes/default/style.css
+++ b/usr/share/javascript/jstree/themes/default/style.css
@@ -122,6 +122,7 @@
   background: #f5f5f5;
   border: 1px solid #979797;
   box-shadow: 2px 2px 2px #999999;
+  z-index: 99;
 }
 .vakata-context ul {
   list-style: none;

[paulgevers]

Hi PE1NUT,

On 21-10-2019 21:54, PE1NUT wrote: index 0703168..ec72841 100644 --- a/libjs-jquery-jstree-3.3.7+dfsg1/src/themes/default/style.css +++ b/usr/share/javascript/jstree/themes/default/style.css @@ -122,6 +122,7 @@ background: #f5f5f5; border: 1px solid #979797; box-shadow: 2px 2px 2px #999999; * z-index: 99; } .vakata-context ul { list-style: none;

Can you try if this works equally well for you? If it does, it short of strengthens my desire of the Cacti maintainers to maintain the delta of their themes in main.css instead of in the theme default/style.css (which comes from upstream). paul@testavoira ~/packages/cacti/cacti-upstream/include/themes/modern $ diff main.css /usr/share/cacti/site/include/themes/modern/main.css 2626a2627,2630

…

.vakata-context ul { z-index: 99; }