Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Fix browsing by product tag #2796

Merged
merged 5 commits into from Sep 7, 2017

Conversation

foladipo
Copy link
Contributor

@foladipo foladipo commented Sep 6, 2017

Resolves #2626.

This PR fixes a bug in the marketplace branch. The cause was that this app was executing a certain callback that does setState in a React component that had been unmounted. This caused an error to be thrown in the browser console.

Test instructions

  1. Create a new product.
  2. Create a few (new) tags to that product.
  3. Complete the creation of that product (by filling other fields) and publish it.
  4. Add one of these tags to the list of main tags in the navbar. (They are highlighted in the screenshot below.)
  5. Then, add two or more tags as sub-tags of the first.
  6. Navigate to the root of the app e.g localhost:3000.
  7. Click the sub tag created above to go to localhost:3000/tags/SUB_TAG and click outside the navbar.
  8. Check the browser console. It should be free of the error reported here.
  9. Repeat the last three steps a few more times using other sub-tags/tags.

highlighted - screen shot 2017-09-06 at 6 42 33 pm

@foladipo foladipo changed the title [WIP] Fix browsing by product tag Fix browsing by product tag Sep 6, 2017
Copy link
Collaborator

@zenweasel zenweasel left a comment

Choose a reason for hiding this comment

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

Just a question and maybe remove the strange code comment?

@@ -114,6 +116,7 @@ const wrapComponent = (Comp) => (
componentDidMount() {
window.addEventListener("resize", this.onWindowResize);
this.onWindowResize();
this._isMounted = true;
Copy link
Collaborator

Choose a reason for hiding this comment

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

What is prefacing this variable with an underscore supposed to indicate/accomplish?

Copy link
Contributor Author

Choose a reason for hiding this comment

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

I prefixed that variable with an underscore to show that it's a custom implementation of the now deprecated ReactComponent.isMounted() as advised in this official React post.

Copy link
Contributor Author

Choose a reason for hiding this comment

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

Furthermore, it's consistent with the _unmounted variable in imports/plugins/core/components/lib/composer/compose.js.

Copy link
Collaborator

Choose a reason for hiding this comment

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

Great. Works for me.

@@ -259,11 +263,13 @@ const wrapComponent = (Comp) => (
this.setState({ attachedBodyListener: false });
}

// TODO: If this is a method of TagNavContainer, why is it, and many
// others, declared as an arrow function?
Copy link
Collaborator

Choose a reason for hiding this comment

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

I don't know if a TODO code comment is the best place to get a programming question answered.

Copy link
Collaborator

@zenweasel zenweasel left a comment

Choose a reason for hiding this comment

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

Let's make the variable naming consistent with the rest of the code base

@zenweasel
Copy link
Collaborator

This works and I would like to merge it but I don't know what's up with the underscored variables

@zenweasel zenweasel merged commit 72e601f into marketplace Sep 7, 2017
@zenweasel zenweasel deleted the folusho-fix-browsing-by-product-tag-2626 branch September 7, 2017 09:45
@spencern spencern mentioned this pull request Oct 11, 2017
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

3 participants