[Django] #37180: Fix assertions in SelectFilter height selenium tests.

[Django]

#37180: Fix assertions in SelectFilter height selenium tests.
-------------------------------------+-------------------------------------
Reporter: Varun Kasyap | Type:
Pentamaraju | Uncategorized
Status: new | Component: Testing
| framework
Version: dev | Severity: Normal
Keywords: | Triage Stage:
| Unreviewed
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
-------------------------------------+-------------------------------------
in test_selectbox_height_collapsible_fieldset and
test_selectbox_height_not_collapsible_fieldset tests in
admin_views/tests.py (introduced in #33024)

these tests compare the height of the inner <select> boxes (from_box and
to_box)

since, the UI was updated to use CSS Flexbox, Flexbox makes the outer
containers (.selector-available and .selector-chosen) equal in height, not
the inner <select> boxes.

Because the help text for the right box ("Remove toppings...") is longer
than the left box ("Choose toppings..."), it can wrap into an extra line
on smaller screens. When the text wraps into 3 lines, Flexbox
automatically shrinks the inner <select> box to adjust. This means the
inner boxes will have different heights.


The current Selenium tests are passing mostly by luck. But if the test
runs in a different window size, this could fail.

We should update the test to compare the heights of the outer flex
containers only.
--
Ticket URL: <https://code.djangoproject.com/ticket/37180>
Django <https://code.djangoproject.com/>
The Web framework for perfectionists with deadlines.

[Django]

#37180: Fix assertions in SelectFilter height selenium tests.
-------------------------------------+-------------------------------------

Reporter: Varun Kasyap | Owner: (none)
Pentamaraju |
Type: Uncategorized | Status: new

Component: Testing framework | Version: dev

Severity: Normal | Resolution:

Keywords: | Triage Stage:
| Unreviewed
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
-------------------------------------+-------------------------------------

Changes (by Varun Kasyap Pentamaraju):

* Attachment "ss.png" added.

[Django]

#37180: Fix assertions in SelectFilter height selenium tests.
-------------------------------------+-------------------------------------
Reporter: Varun Kasyap | Owner: (none)
Pentamaraju |
Type: Uncategorized | Status: new
Component: Testing framework | Version: dev
Severity: Normal | Resolution:
Keywords: | Triage Stage:
| Unreviewed
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
-------------------------------------+-------------------------------------

Description changed by Varun Kasyap Pentamaraju:

Old description:

> in test_selectbox_height_collapsible_fieldset and
> test_selectbox_height_not_collapsible_fieldset tests in
> admin_views/tests.py (introduced in #33024)
>
> these tests compare the height of the inner <select> boxes (from_box and
> to_box)
>
> since, the UI was updated to use CSS Flexbox, Flexbox makes the outer
> containers (.selector-available and .selector-chosen) equal in height,
> not the inner <select> boxes.
>
> Because the help text for the right box ("Remove toppings...") is longer
> than the left box ("Choose toppings..."), it can wrap into an extra line
> on smaller screens. When the text wraps into 3 lines, Flexbox
> automatically shrinks the inner <select> box to adjust. This means the
> inner boxes will have different heights.
>

> The current Selenium tests are passing mostly by luck. But if the test
> runs in a different window size, this could fail.
>
> We should update the test to compare the heights of the outer flex
> containers only.

New description:

in test_selectbox_height_collapsible_fieldset and
test_selectbox_height_not_collapsible_fieldset tests in
admin_views/tests.py (introduced in #33024)

these tests compare the height of the inner <select> boxes (from_box and
to_box)

since, the UI was updated to use CSS Flexbox, Flexbox makes the outer
containers (.selector-available and .selector-chosen) equal in height, not
the inner <select> boxes.

as shown in attached screenshot:

Because the help text for the right box ("Remove toppings...") is longer
than the left box ("Choose toppings..."), it can wrap into an extra line
on smaller screens. When the text wraps into 3 lines, Flexbox
automatically shrinks the inner <select> box to adjust. This means the
inner boxes will have different heights.

The current Selenium tests are passing mostly by luck. But if the test

runs in a different window size, it could fail.

We should update the test to compare the heights of the outer flex
containers only.

--

--
Ticket URL: <https://code.djangoproject.com/ticket/37180#comment:1>

[Django]

#37180: Fix assertions in SelectFilter height selenium tests.
-------------------------------------+-------------------------------------
Reporter: Varun Kasyap | Owner: (none)
Pentamaraju |

Type: | Status: new
Cleanup/optimization |
Component: contrib.admin | Version: dev

Severity: Normal | Resolution:
Keywords: | Triage Stage:
| Unreviewed
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
-------------------------------------+-------------------------------------

Changes (by Jacob Walls):

* component: Testing framework => contrib.admin
* type: Uncategorized => Cleanup/optimization

Comment:

Thanks, I've noticed this as well.
--
Ticket URL: <https://code.djangoproject.com/ticket/37180#comment:2>

[Django]

#37180: Fix assertions in SelectFilter height selenium tests.
-------------------------------------+-------------------------------------
Reporter: Varun Kasyap | Owner: (none)
Pentamaraju |
Type: | Status: new
Cleanup/optimization |
Component: contrib.admin | Version: dev
Severity: Normal | Resolution:

Keywords: | Triage Stage: Accepted

Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
-------------------------------------+-------------------------------------

Changes (by Tim Graham):

* stage: Unreviewed => Accepted

--
Ticket URL: <https://code.djangoproject.com/ticket/37180#comment:3>

[Django]

#37180: Fix assertions in SelectFilter height selenium tests.
-------------------------------------+-------------------------------------

Reporter: Varun Kasyap | Owner: Amar
Pentamaraju |
Type: | Status: assigned

Cleanup/optimization |
Component: contrib.admin | Version: dev
Severity: Normal | Resolution:
Keywords: | Triage Stage: Accepted
Has patch: 0 | Needs documentation: 0
Needs tests: 0 | Patch needs improvement: 0
Easy pickings: 0 | UI/UX: 0
-------------------------------------+-------------------------------------

Changes (by Amar):

* owner: (none) => Amar
* status: new => assigned

--
Ticket URL: <https://code.djangoproject.com/ticket/37180#comment:4>