1343255 - Navbar Menu doesn't work after collapsing for smaller screens in Admin Window.

Status: RESOLVED FIXED

(Release Engineering Graveyard :: Applications: Balrog (frontend), defect, P3)

Description

[Anjul Tyagi]

User Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/56.0.2924.87 Safari/537.36

Steps to reproduce:

Click on the Collapsed Navbar on top right corner in mobile view to switch between Rules, Releases, Permissions and Home.


Actual results:

Menu didn't respond


Expected results:

Dropdown menu should have appeared with options to navigate to either of Home, Rules, Releases or Permissions.

Comment 1

[Nitin]

Hi, I'm interested in solving this bug. Can you please specify the steps to follow as I am new to this?

Comment 2

[Anjul Tyagi]

Hey Nitin, Good to hear that you're interested in this bug. 

If you haven't already, first set up balrog locally. All the necessary steps for setting up the local environment and contributing to balrog are listed on the GitHub repository at https://github.com/mozilla/balrog.

Specifically for this bug, try looking https://github.com/mozilla/balrog/tree/master/ui for the solution.

Comment 3

[Nitin]

I tried setting balrog locally as described in the docs. But it always seems to have the following the exception.

balrogagent_1  | Traceback (most recent call last):
balrogagent_1  |   File "/app/balrogagent/cmd.py", line 28, in run_agent
balrogagent_1  |     auth=auth, loop=loop)
balrogagent_1  |   File "/app/balrogagent/client.py", line 32, in request
balrogagent_1  |     resp = await aiohttp.request(method, url, data=json.dumps(data), headers=headers, auth=auth, loop=loop)
balrogagent_1  |   File "/usr/local/lib/python3.5/site-packages/aiohttp/client.py", line 585, in __await__
balrogagent_1  |     return (yield from self._coro)
balrogagent_1  |   File "/usr/local/lib/python3.5/site-packages/aiohttp/client.py", line 186, in _request
balrogagent_1  |     conn = yield from self._connector.connect(req)
balrogagent_1  |   File "/usr/local/lib/python3.5/site-packages/aiohttp/connector.py", line 331, in connect
balrogagent_1  |     .format(key, exc.strerror)) from exc
balrogagent_1  | aiohttp.errors.ClientOSError: [Errno 113] Cannot connect to host balrogadmin:7070 ssl:False [Can not connect to balrogadmin:7070 [Connect call failed ('172.17.0.4', 7070)]]
balrogagent_1  | 2017-03-07 07:24:35,355 - DEBUG - root.run_agent#25: Looking for active scheduled changes for endpoint rules...
balrogagent_1  | 2017-03-07 07:24:35,355 - DEBUG - root.request#31: Sending GET request to http://balrogadmin:7070/api/scheduled_changes/rules
balrogagent_1  | 2017-03-07 07:24:38,355 - ERROR - root.run_agent#66: Encountered exception:
balrogagent_1  | Traceback (most recent call last):
balrogagent_1  |   File "/usr/local/lib/python3.5/site-packages/aiohttp/connector.py", line 607, in _create_connection
balrogagent_1  |     local_addr=self._local_addr)
balrogagent_1  |   File "/usr/local/lib/python3.5/asyncio/base_events.py", line 775, in create_connection
balrogagent_1  |     raise exceptions[0]
balrogagent_1  |   File "/usr/local/lib/python3.5/asyncio/base_events.py", line 762, in create_connection
balrogagent_1  |     yield from self.sock_connect(sock, address)
balrogagent_1  |   File "/usr/local/lib/python3.5/asyncio/selector_events.py", line 451, in sock_connect
balrogagent_1  |     return (yield from fut)
balrogagent_1  |   File "/usr/local/lib/python3.5/asyncio/futures.py", line 380, in __iter__
balrogagent_1  |     yield self  # This tells Task to wait for completion.
balrogagent_1  |   File "/usr/local/lib/python3.5/asyncio/tasks.py", line 304, in _wakeup
balrogagent_1  |     future.result()
balrogagent_1  |   File "/usr/local/lib/python3.5/asyncio/futures.py", line 293, in result
balrogagent_1  |     raise self._exception
balrogagent_1  |   File "/usr/local/lib/python3.5/asyncio/selector_events.py", line 481, in _sock_connect_cb
balrogagent_1  |     raise OSError(err, 'Connect call failed %s' % (address,))
balrogagent_1  | OSError: [Errno 113] Connect call failed ('172.17.0.4', 7070)
balrogagent_1  | 
balrogagent_1  | The above exception was the direct cause of the following exception:
balrogagent_1  | 
balrogagent_1  | Traceback (most recent call last):
balrogagent_1  |   File "/usr/local/lib/python3.5/site-packages/aiohttp/connector.py", line 321, in connect
balrogagent_1  |     yield from self._create_connection(req)
balrogagent_1  |   File "/usr/local/lib/python3.5/site-packages/aiohttp/connector.py", line 630, in _create_connection
balrogagent_1  |     (req.host, req.port, exc.strerror)) from exc
balrogagent_1  | aiohttp.errors.ClientOSError: [Errno 113] Can not connect to balrogadmin:7070 [Connect call failed ('172.17.0.4', 7070)]

Could you please giude me through the problem I'm getting here.

Comment 4

[Anjul Tyagi]

You don't neet to worry about this exception to solve this bug. However, it takes time setting up Balrog for the first time, so to check that, try running "localhost:8080" on your browser after running "docker-compose up" (I hope you've already setup docker and docker-compose). When the UI for the Admin interface appears (it might take time as it depends on the service "balrogui" to start), you're good to go.

=> After this, you can try to reproduce this bug by changing the window size of your browser until the navbar on top of the Admin view collapses. Then click on the collapsed menu button on top right.

Comment 5

[Nitin]

I've submitted a PR for this to the github repo.
https://github.com/mozilla/balrog/pull/267

Comment 6

[Nitin]

(In reply to Nitin from comment #5)
> I've submitted a PR for this to the github repo.
> https://github.com/mozilla/balrog/pull/267

Sorry. the link is https://github.com/mozilla/balrog/pull/272

Comment 7

[[github robot]]

Commit pushed to master at https://github.com/mozilla/balrog

https://github.com/mozilla/balrog/commit/4fa57e1be814a50b6fe44b1e475aa1051f3e1a4c
bug 1343255: Navbar Menu doesn't work after collapsing for smaller screens in Admin Window (#272). r=bhearsum

Comment 8

[[e-mail] (:bhearsum)]

This is in production, thanks for the contribution Nitin!