Skip to content
This repository has been archived by the owner on Apr 18, 2024. It is now read-only.

[BUG-FIX] "Recent Searches" list doesn't work because of changed result list structure #55

Merged
merged 1 commit into from
Nov 21, 2019

Conversation

icyflame
Copy link
Member

@icyflame icyflame commented Nov 21, 2019

Bug

  1. Clicking on a result link doesn't add the current search term to the recent searches link
  2. Even if new searches are added, old searches are not removed properly leading to duplicates in the Recent Searches list (even though there are none in Local Storage)

Trigger

#52 made a lot of changes to the UI and the JS code.

  1. Recent searches not working
    1. Document click handler added the search to the recent searches list
    2. This handler was checking to see if the clicked element had the class result-link
    3. The result list structure was changed from a.result-link to a.result-link > div h1
    4. In the new structure, every click's target would be one of the children: div or h1, and neither of them have the result-link class, so the click handler would not consider the clicked element as a result link and won't add the search term to the recent searches list
  2. Duplicate searches not removed from the Recent searches list
    1. Once bug 1 is fixed, this bug shows up. This was also introduced by the same PR
    2. When a new search term is clicked, the current logic performs the following steps:
      1. Replace current term it in the old stored string
      2. Add current term to the old string
      3. Store the string in localStorage
      4. Remove the elements matching the current term from the currently displayed Recent Searches list => BUG
      5. Prepend the current search term to the recent searches list (thus bringing to the top)
    3. In step 4 above, the removal relies on the structure of the Recent Searches list.
      1. Before: ul.local-storage-list div > a
      2. After: ul.local-storage-list > li > a

Impact

  • Recent searches were not stored for users since Oct 19, 2019

Fix

  1. Attach the handler to a.result-link => This ensures that the handler is triggered whenever the a or one of it's children are clicked
  2. Fix the element pattern for removing duplicates from the recent searches page

I have tested this locally in a bunch of scenarios and it works as expected. 👍

Fix #54

Other changes in this PR

  • Make the UI UX Mobile friendly and refreshing #52 also converted several function calls to write the arguments one line each. This is especially confusing when the full search call can be accomodated on a single line. I changed some fuctions. I will run semistandard --lint on the JS file in a later PR.

- This bug was introduced because the structure of the result list was
changed
- Before: It was only a straight list of `<a>` in a `ul`
- After: Each result item was changed to `a > div > h1` and
subsequently, the selector which was verifying that the clicked element
was a result link didn't work as expected
- There was a separate problem with the movement of the Recent Searches
list to the sidebar. The `div` elements weren't properly arranged;
leading to an empty list called "Recent Searches"
client.js Show resolved Hide resolved
Copy link
Contributor

@thealphadollar thealphadollar left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM. Thanks a lot for taking out time from your schedule to send the fix ✨

A small change I've requested, please see if it fits. I'll merge it post your response.

.editorconfig Show resolved Hide resolved
client.js Show resolved Hide resolved
@thealphadollar thealphadollar merged commit cc46669 into gh-pages Nov 21, 2019
@thealphadollar thealphadollar deleted the bug-fix-local-storage branch November 21, 2019 16:32
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Recent Searches Not Working
2 participants