$75 | “More” tab is not swapping position with the first element to the left of the tab

[codejamtc]

https://www.screencast.com/t/Gr2VNvQ8

1. Open the application https://test-community-app.topcoder-dev.com/challenges
2. Login as dan_developer (Landscape)
3. Tap Menu > Work > More > Community

Actual: “More” tab is not swapping position with the first element to the left of the tab

Expected: Selecting an option from the “More” tab should become visible and swap position with the first element to the left of the tab. This functionality can be observed on Google search.

Reproducibility Rate: 3/3

Environment: Samsung Galaxy Tab A (2017), 7 inch

Browser: Chrome 75.0.3770.80

[yoution]

please assign to me

[yoution]

how to reproduct the problem, the 'more' button is not show, how to show it

[luizrrodrigues]

@yoution Open in Firefox or reduce window size.

[yoution]

if I click 'explore','complete' go to the 'explore' position or go to the first place before 'track'? there is only three tab in my account, could you give me a test account has more tabs

[luizrrodrigues]

@yoution This menu is same to all accounts.

What we looking is:

• Click in More;
• Click in Explore;
• Will go to Explore page (like existing) and will swipe the Compete with Explore;

So in your screenshot above will be:
Explore - More [ Tracks - Compete ]

Like as Google Search menu works, check:

Screen Recording 2020-01-09 at 22.39.38.mov.zip

[yoution]

https://github.com/topcoder-platform/navigation-component/pull/83

I have pushed , please review

[yoution]

please use this, my workflow is someting wrong, https://github.com/topcoder-platform/navigation-component/pull/89

[luizrrodrigues]

@yoution I see the swapping, but if click in level 3 menu will swap again to original position.

Please check:

Screen Recording 2020-01-14 at 07.35.03.mov.zip

[yoution]

@luizrrodrigues please review

[yoution]

https://github.com/topcoder-platform/navigation-component/pull/107

[luizrrodrigues]

@yoution If access link directly, like: http://local.topcoder.com/community/qa

swapping not working, still showing Community -> Compete - More

[yoution]

@luizrrodrigues https://github.com/topcoder-platform/navigation-component/pull/107 two commit , I add new commit,please review

[luizrrodrigues]

@yoution Looks like not working in Firefox, working well in another browsers.

[yoution]

@luizrrodrigues https://monosnap.com/file/waNYOBDyc4onocBc66Y1UfDlBxyoHM in my computer it work well

[luizrrodrigues]

@yoution I'll recheck.

[luizrrodrigues]

@yoution Looks good, I just redeploy from fresh repo and works well.

[luizrrodrigues]

@yoution please check: https://github.com/topcoder-platform/navigation-component/pull/107#issuecomment-575841552

[luizrrodrigues]

@yoution

Please check:

Screen Recording 2020-01-21 at 22.07.26.mov.zip

Same related in #141

This happen you go to same second level menu, ex.: 1) Select Tracks -> QA 2) Select Explore 3) Back to Tracks (see the issue)

[yoution]

@luizrrodrigues the green indicator not show correctly when switch tab？I will check

[luizrrodrigues]

Yes, Green indicator show in wrong position when follow the steps above.

[yoution]

@luizrrodrigues please review https://github.com/topcoder-platform/navigation-component/pull/128

[luizrrodrigues]

@yoution Please check video bellow, issue still exist:

Screen Recording 2020-01-27 at 20.51.36.mov.zip

[yoution]

@luizrrodrigues please review again, thanks https://github.com/topcoder-platform/navigation-component/pull/149

[luizrrodrigues]

@yoution Cool, looks good now.

[SathyaJayabal]

I am sorry but the issue in #141 still happens. See video

more issue.mov.zip

[luizrrodrigues]

@yoution This happen just showing "More" button, because function will try replace menu in More with no existing out from More.

So when screen in small and just More is showing, need ignore swipe function.

Make sense?

[SathyaJayabal]

@luizrrodrigues , Please make sure this issue is also fixed. On a tab size window, when you click on more->menu->sub menu, the selection indicator moves from more to Community https://github.com/topcoder-platform/navigation-component/issues/62#issuecomment-567965305

selection indicator.mov.zip

[yoution]

@luizrrodrigues https://github.com/topcoder-platform/navigation-component/pull/150 have pushed, please review

[yoution]

@luizrrodrigues I have pushed again, please review this one https://github.com/topcoder-platform/navigation-component/pull/151 . thanks