public inbox for [email protected]  
help / color / mirror / Atom feed
From: Aditya Toshniwal <[email protected]>
To: Akshay Joshi <[email protected]>
Cc: pgadmin-hackers <[email protected]>
Subject: Re: [pgAdmin][RM5488] Tooltip information does not display properly if user check all options under explain analyze
Date: Wed, 20 Jan 2021 16:37:14 +0530
Message-ID: <CAM9w-_kWgUUgepx3d96uJMWkpCQHvgChQtV+zzj0s41x3kWsfQ@mail.gmail.com> (raw)
In-Reply-To: <CANxoLDf7HmHSLePRbnfgU3=pt4KmZnAdsVdiUBhC2pBe7_W9aw@mail.gmail.com>
References: <CAM9w-_=KPNn63qWUtgfRrOpCDjxq3LFi32_eXTAXjn_AkHX8wQ@mail.gmail.com>
	<CANxoLDeR2s8f6Amc22HvBQxuotFxH=DM5nA41d33-e2dSOt__g@mail.gmail.com>
	<CAM9w-_==zEUfHD63TpKbBAMUxNxLwOO01LtiNLSrT9M8oL-eDw@mail.gmail.com>
	<CANxoLDf7HmHSLePRbnfgU3=pt4KmZnAdsVdiUBhC2pBe7_W9aw@mail.gmail.com>

Hi Hackers,

Attached patch:
1) Fixes the broken explain GUI test case.
2) Displays a tooltip "Click for details..." on hover over explain plan
nodes.

Please review.

On Tue, Jan 12, 2021 at 4:45 PM Akshay Joshi <[email protected]>
wrote:

> Thanks, patch applied.
>
> On Tue, Jan 12, 2021 at 4:08 PM Aditya Toshniwal <
> [email protected]> wrote:
>
>> Hi Akshay,
>>
>> Attached is the updated patch. Please review.
>>
>> On Tue, Jan 12, 2021 at 2:51 PM Akshay Joshi <
>> [email protected]> wrote:
>>
>>> Hi Aditya
>>>
>>> Code looks good to me. Below are the review comments:
>>>
>>>    - Copy and Paste not working in the popup.
>>>    - Documentation needs to be updated.
>>>
>>>
>>> On Mon, Jan 11, 2021 at 4:38 PM Aditya Toshniwal <
>>> [email protected]> wrote:
>>>
>>>> Hi Hackers,
>>>>
>>>> Attached patch improves the way explain plan details tooltip for a node
>>>> is shown. With the change, popup with details will be shown upon clicking a
>>>> node, and it will remain open until explicitly closed.
>>>>
>>>> Please review.
>>>>
>>>> --
>>>> Thanks,
>>>> Aditya Toshniwal
>>>> pgAdmin hacker | Sr. Software Engineer | *edbpostgres.com*
>>>> <http://edbpostgres.com;
>>>> "Don't Complain about Heat, Plant a TREE"
>>>>
>>>
>>>
>>> --
>>> *Thanks & Regards*
>>> *Akshay Joshi*
>>> *pgAdmin Hacker | Principal Software Architect*
>>> *EDB Postgres <http://edbpostgres.com>*
>>>
>>> *Mobile: +91 976-788-8246*
>>>
>>
>>
>> --
>> Thanks,
>> Aditya Toshniwal
>> pgAdmin hacker | Sr. Software Engineer | *edbpostgres.com*
>> <http://edbpostgres.com;
>> "Don't Complain about Heat, Plant a TREE"
>>
>
>
> --
> *Thanks & Regards*
> *Akshay Joshi*
> *pgAdmin Hacker | Principal Software Architect*
> *EDB Postgres <http://edbpostgres.com>*
>
> *Mobile: +91 976-788-8246*
>


-- 
Thanks,
Aditya Toshniwal
pgAdmin hacker | Sr. Software Engineer | *edbpostgres.com*
<http://edbpostgres.com;
"Don't Complain about Heat, Plant a TREE"


Attachments:

  [application/octet-stream] RM5488.feature.patch (2.1K, 3-RM5488.feature.patch)
  download | inline diff:
diff --git a/web/pgadmin/feature_tests/xss_checks_panels_and_query_tool_test.py b/web/pgadmin/feature_tests/xss_checks_panels_and_query_tool_test.py
index d309c4cfd..93971eb86 100644
--- a/web/pgadmin/feature_tests/xss_checks_panels_and_query_tool_test.py
+++ b/web/pgadmin/feature_tests/xss_checks_panels_and_query_tool_test.py
@@ -313,7 +313,7 @@ class CheckForXssFeatureTest(BaseFeatureTest):
                     self.driver.find_element_by_css_selector(
                         'div.pgadmin-explain-container > svg > g > g > image'
                     )
-                ).perform()
+                ).click().perform()
                 break
             except Exception:
                 if idx != 2:
@@ -326,8 +326,8 @@ class CheckForXssFeatureTest(BaseFeatureTest):
                     )
                     raise
 
-        source_code = self.driver.find_element_by_id(
-            'toolTip').get_attribute('innerHTML')
+        source_code = self.driver.find_element_by_css_selector(
+            '.pgadmin-explain-details:not(.d-none)').get_attribute('innerHTML')
 
         self._check_escaped_characters(
             source_code,
diff --git a/web/pgadmin/misc/static/explain/js/explain.js b/web/pgadmin/misc/static/explain/js/explain.js
index da595e6b3..c478288b8 100644
--- a/web/pgadmin/misc/static/explain/js/explain.js
+++ b/web/pgadmin/misc/static/explain/js/explain.js
@@ -947,7 +947,10 @@ define('pgadmin.misc.explain', [
         IMAGE_WIDTH,
         IMAGE_HEIGHT
       );
-      image.attr({style: 'cursor: pointer'});
+      image.attr({
+        style: 'cursor: pointer',
+        class: 'image-node',
+      });
 
       // Draw tooltip
       var image_data = this.toJSON(),
@@ -1478,6 +1481,10 @@ define('pgadmin.misc.explain', [
             }
           });
         });
+        container.find('.image-node').tooltip({
+          title: gettext('Click for details...'),
+          template: '<div class="tooltip" role="tooltip"><div class="arrow d-none"></div><div class="tooltip-inner"></div></div>'
+        })
       });
 
       _renderExplainTable(ctx._explainTable, explainTable);


view thread (6+ messages)  latest in thread

reply

Reply instructions:

You may reply publicly to this message via plain-text email
using any one of the following methods:

* Reply to all the recipients using the --to and --cc options:
  reply via email

  To: [email protected]
  Cc: [email protected], [email protected]
  Subject: Re: [pgAdmin][RM5488] Tooltip information does not display properly if user check all options under explain analyze
  In-Reply-To: <CAM9w-_kWgUUgepx3d96uJMWkpCQHvgChQtV+zzj0s41x3kWsfQ@mail.gmail.com>

* Save the following mbox file, import it into your mail client,
  and reply-to-all from there: mbox

This inbox is served by agora; see mirroring instructions
for how to clone and mirror all data and code used for this inbox