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

[Bug]: Category products not loading first time #308

Open
1 task done
shozayen opened this issue Aug 29, 2024 · 0 comments
Open
1 task done

[Bug]: Category products not loading first time #308

shozayen opened this issue Aug 29, 2024 · 0 comments
Labels
bug Something isn't working

Comments

@shozayen
Copy link

shozayen commented Aug 29, 2024

Expected Behavior

Products from Category.vue should be loaded

Actual Behavior

First time I navigate to categories page which should show all products, instead it showed and the below error screenhost.
If I leave the Categories page and navigate to any other page, then come back, the products are loaded. When I use the inspect, I can see the products are loaded and no issue.

Error description
The error I can see in the console refers to result.value being sent as undefined. All methods that use the result.value then start to throw errors, which lead to below screenshot.

image

Possible Solution

I have no idea why the result.value is not yet loaded, and the getters method called it before it was loaded.

Steps to reproduce

Steps:

  • Open localhost:3000 (or main page)
  • Navigate to products page, not to a specific category, but to page that has all products.
  • Component not loaded, and an error is shown instead.

What version of Spree integration are you using?

v1.5.0

What version of Node.js are you using?

v14.18.0

What browser (and version) are you using?

Chrome, Safari

What operating system (and version) are you using?

macOs, Iphone, Windows

Relevant log output

result.value is not yet defined when below methods were calling it:
    const products = computed(() => facetGetters.getProducts(result.value));
    const breadcrumbs = computed(() => facetGetters.getBreadcrumbs(result.value).map(e => ({...e, link: context.localePath(e.link)})));
    const pagination = computed(() => facetGetters.getPagination(result.value));
    const categoryTree = computed(() => facetGetters.getCategoryTree(result.value));



Error in chrome:
client.js:103 TypeError: Cannot read properties of undefined (reading 'parent')
    at buildBreadcrumbs (categoryGetters.ts:24:1)
    at getCategoryBreadcrumbs (categoryGetters.ts:34:1)
    at Object.getBreadcrumbs (facetGetters.ts:58:1)
    at VueComponent.eval (Category.vue:256:1)
    at Watcher.get (vue.common.dev.js:4490:1)
    at Watcher.evaluate (vue.common.dev.js:4592:1)
    at RefImpl.computedGetter [as value] (vue-composition-api.esm.js:1463:1)
    at VueComponent.get [as breadcrumbs] (vue-composition-api.esm.js:1689:1)
    at Object.get (vue.common.dev.js:2109:1)
    at Proxy.render (Category.vue:10:1)
image

Code of Conduct

  • I agree to follow this project's Code of Conduct
@shozayen shozayen added the bug Something isn't working label Aug 29, 2024
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working
Projects
None yet
Development

No branches or pull requests

2 participants
@shozayen and others