CSS issue on Airflow 1.10 Tree view UI

[Adityan MS <ad...@poshmark.com>]

Hi,

After upgrading to airflow 1.10, hovering the mouse over the rectangles in
tree view, causes the tooltip to popup much higher than it used to be. Any
quick fix for this behavior? In the screenshot, the right lowermost
rectangle is the one that is being hovered over.

Once you scroll down on the tree view, the tooltip starts floating up.

Things I have tried to fix this behavior:
1. Change the css themes in airflow.cfg and restart the web server
2. Inspected the tooltip in Chrome, it seems to be a dynamically generated
CSS class. The CSS class controlling this behavior seem to be the same in
Airflow 1.9.

Has anyone else run into this issue?

Thanks!

Re: CSS issue on Airflow 1.10 Tree view UI

[Adityan MS <ad...@poshmark.com>]

Hi Ash,

Here's the link to the screenshot. https://snag.gy/JUvcGy.jpg

Actually, this issue is happening only on Airflow 1.10. We have the same
list of tasks that is very tall (such that the page needs to be scrolled)
and we were running Airflow 1.9, and it seemed totally fine. We upgraded to
1.10, and then we saw the tooltip issue with the same list of tasks. We
have RBAC turned on with Authentication type being set to OAuth.

Here's a diff between tree.html in Airflow 1.9 and 1.10.

diff
/Users/nnaik/anaconda2/lib/python2.7/site-packages/airflow/www/templates/airflow/tree.html
/Users/nnaik/anaconda2/lib/python2.7/site-packages/airflow/www_rbac/templates/airflow/tree.html

25c25
< <link href="{{
admin_static.url(filename='vendor/bootstrap-daterangepicker/daterangepicker-bs2.css')
}}" rel="stylesheet">
---
> <link href="{{ url_for('static',
filename='appbuilder/daterangepicker/bootstrap-datepicker.css') }}"
rel="stylesheet">
28c28
< {% block body %}
---
> {% block content %}

Thanks!

On Mon, Nov 12, 2018 at 9:19 AM Ash Berlin-Taylor <as...@apache.org> wrote:

> Screenshots (attachments) don't come through on the list - could you post
> a link to it somewhere?
>
> Does this only apply when the list of tasks is particularly tall or wide?
> A simple case I can't reproduce this on 1.10.1b1 (but I don't think
> anythere has changed recently.)
>
> -ash
>
> > On 9 Nov 2018, at 20:25, Adityan MS <ad...@poshmark.com> wrote:
> >
> > Hi,
> >
> > After upgrading to airflow 1.10, hovering the mouse over the rectangles
> in tree view, causes the tooltip to popup much higher than it used to be.
> Any quick fix for this behavior? In the screenshot, the right lowermost
> rectangle is the one that is being hovered over.
> >
> > Once you scroll down on the tree view, the tooltip starts floating up.
> >
> > Things I have tried to fix this behavior:
> > 1. Change the css themes in airflow.cfg and restart the web server
> > 2. Inspected the tooltip in Chrome, it seems to be a dynamically
> generated CSS class. The CSS class controlling this behavior seem to be the
> same in Airflow 1.9.
> >
> > Has anyone else run into this issue?
> >
> > Thanks!
> >
> >
>
>

Re: CSS issue on Airflow 1.10 Tree view UI

[Ash Berlin-Taylor <as...@apache.org>]

Screenshots (attachments) don't come through on the list - could you post a link to it somewhere?

Does this only apply when the list of tasks is particularly tall or wide? A simple case I can't reproduce this on 1.10.1b1 (but I don't think anythere has changed recently.)

-ash

> On 9 Nov 2018, at 20:25, Adityan MS <ad...@poshmark.com> wrote:
> 
> Hi,
> 
> After upgrading to airflow 1.10, hovering the mouse over the rectangles in tree view, causes the tooltip to popup much higher than it used to be. Any quick fix for this behavior? In the screenshot, the right lowermost rectangle is the one that is being hovered over.
> 
> Once you scroll down on the tree view, the tooltip starts floating up. 
> 
> Things I have tried to fix this behavior:
> 1. Change the css themes in airflow.cfg and restart the web server
> 2. Inspected the tooltip in Chrome, it seems to be a dynamically generated CSS class. The CSS class controlling this behavior seem to be the same in Airflow 1.9. 
> 
> Has anyone else run into this issue?
> 
> Thanks!
> 
>