Giter Site home page Giter Site logo

vuestorefront / magento2 Goto Github PK

View Code? Open in Web Editor NEW
167.0 28.0 116.0 16.99 MB

Vue Storefront 2 integration for Magento 2

Home Page: https://docs.vuestorefront.io/magento

License: MIT License

JavaScript 3.20% TypeScript 96.54% Shell 0.01% Dockerfile 0.02% Handlebars 0.23%
vuejs javascript magento magento2 ecommerce vue-storefront hacktoberfest integrations-team

magento2's People

Contributors

alefbarbeli avatar alexanderdevitsky avatar bartoszherba avatar bensinca avatar bloodf avatar diegoalbag avatar domideimel avatar fifciu avatar filipsobol avatar filrak avatar frodigo avatar github-actions[bot] avatar kevingorjan avatar konarshankar07 avatar liorlindvor avatar maciejrybaniec avatar mattmaribojoc avatar michaelkurowski avatar mkoszut avatar razz21 avatar rohrig avatar roziscoding avatar sequensucks avatar sethidden avatar skirianov avatar vitorluizc avatar web-flow avatar wojtekthewebdev avatar youanden avatar zfmaster avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

magento2's Issues

Improve composables api reference in the docs

Currently in the Magento 2 docs we are using generic interfaces from the core. It doesn't provide enough information to the user as there composables can work really different depending on the platform.

// https://docs.vuestorefront.io/magento/guide/composables/use-category.html#api
interface UseCategory<CATEGORY, CATEGORY_SEARCH_PARAMS> {
    categories: ComputedProperty<CATEGORY[]>;
    search(params: ComposableFunctionArgs<CATEGORY_SEARCH_PARAMS>): Promise<void>;
    loading: ComputedProperty<boolean>;
    error: ComputedProperty<UseCategoryErrors>;
}

We should write there real types and interface for Magento connector like we did in Comemrcetools or Salesforce Commerce Cloud

[Feature]: Apply a coupon

How the project can be improved?

It could be interesting to be able to apply a coupon on shopping cart.

What are the acceptance criteria?

  • Apply a coupon from cart

Additional information

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: Product price is not updated on variant selection

Expected Behavior

For configurable product price should be updated on variant selection according to price setting for variant

Actual Behavior

It's always displayed price of cheapest variant

Possible Solution

The prices for variants are queried from M2 graphql:

... on ConfigurableProduct {
        variants {
          product {
            id
            name
            sku
            price_range{
              minimum_price{
                regular_price{
                  value
                  currency
                }
              }
            }
          }
        }
      }

It's not implemented atm in vuestorefront/magento2

Steps to reproduce

  1. Find configurable product with different prices for variant (I prepared testing environment with clean M2 v2.4.3 and sample data, here is the product fits conditions: https://vsf-magento.mediabridge.solutions/eos-v-neck-hoodie.html )
  2. Select variants with different price on standard M2 FE (for example product it's different colors of XL size). Observe price changed
  3. Select variants with different price on VSF (here is same product: https://vsf.mediabridge.solutions/p/WH11/eos-v-neck-hoodie.html ). Observe price is not changed.

What version of Magento 2 integration are you using?

develop

What version of Node.js are you using?

14.17.4

What browser (and version) are you using?

Chrome, FF

What operating system (and version) are you using?

Ubuntu 20.04

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

Fix the AddToCart Button on Category.vue for ConfigurableProduct

On the Category.vue when a product is displayed, an AddToCart button is visible, but if a product is from the type ConfigurableProduct it needs to have a certain amount of data before sending to the AddToCart function.


We need to check if we will go to the product if custom, then if it is, we will redirect the user to the Product Page, and won't add it to the Cart.

[Feature]: Improve user experience on Variant selection for Configurable product

How the project can be improved?

When switch between product variants is done, the delay exists caused by additional queries few different reasons. It creates worse user experience comparing to M2 standard FE.

Example:

  1. Try it on standard FE: https://vsf-magento.mediabridge.solutions/eos-v-neck-hoodie.html
  2. Try it on VSF: https://vsf.mediabridge.solutions/p/WH11/eos-v-neck-hoodie.html
  3. Try it on VSF1: https://capybara.storefrontcloud.io/pierce-gym-short.html?childSku=MSH12-32-Black

We could preload all data on product details query and then just reuse it

There are few things which have influence on user experience:

  1. For loading Variant data 4 queries are executed. Product is updated only when all queries are executed.
  2. Some calculations happen on variant selection on client side. It adds also delay in variant switch
  3. On variant switch no visible signals are sent to customer so he don't know Variant queries are performed.

What are the acceptance criteria?

  • Switch between variants is done with same user experience as on standard M2 FE
  • The configurable product data is updated correctly
  • No impact on product detail page on configurable products with big amount of variants

Additional information

  • We could combine this improvement with this bug: #133
  • It's important to test it on product with big amount of variants, because it looks there exists real world examples of products with few thousands of variants: #22 (comment)

Code of Conduct

  • I agree to follow this project's Code of Conduct

Config api url not working

Hi everyone, after do all step follow https://github.com/vuestorefront/magento2, my website running with no error in homepage. But some function like useCart, useReview not using config magentoGraphQl. They just use default url "host:port/api/". Is there anything I need to do for this? (Some function woking: useProduct...)

Create an way to the user to add an extesion in the API, Composeable and Theme.

In Magento it's possible for the user to add custom plugins and modules to their Magento installation.

Those modules and plugins add new functionalities in the GraphQL schema, and into the application.

We need to find a way for the user to increment the application through the theme where they will create a custom composeable extension and api-client extension, where it will communicate with the current @vue-storefront/magento installation and just add those extensions.

[Bug]: useCart.load not working correctl with a loop in the creation of the cart

Contact Details

[email protected]

Expected Behavior

No response

Actual Behavior

Screen Shot 2021-07-30 at 13 00 23

Possible Solution

this is my solution, but i still get error, because function setCartId(null) is not work correct (it doesn't update to the cookie immediately)

load: async (context: Context) => {
    const apiState = context.$magento.config.state;
    Logger.debug('[Magento Storefront]: Loading Cart');
    const customerToken = apiState.getCustomerToken();
    let cartId = apiState.getCartId();

    if (customerToken) {
      try {
        const result = await context.$magento.api.customerCart();

        return result.data.customerCart as unknown as Cart;
      } catch (e) {
        apiState.setCartId(null)
        apiState.setCustomerToken(null)
        cartId = null
      }
    }

    if (!cartId) {
      const { data } = await context.$magento.api.createEmptyCart();

      cartId = data.createEmptyCart;

      apiState.setCartId(cartId);
    }

    try {
      const cartResponse = await context.$magento.api.cart(cartId);

      Logger.debug(cartResponse);

      return cartResponse.data.cart as unknown as Cart;
    } catch (e) {
      apiState.setCartId(null);

      return await factoryParams.load(context, {}) as unknown as Cart;
    }

Steps to reproduce

No response

Version

1.0.0-rc.1

What browsers are you seeing the problem on?

Chrome

What node version you were using?

14.x

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: add product to cart (loop infinity) and set billing address on cart (not working)

Contact Details

[email protected]

Expected Behavior

No response

Actual Behavior

add product to cart not working (loop infinity)

Screen Shot 2021-08-06 at 10 21 58

set billing address on cart not working

Screen Shot 2021-08-06 at 10 32 43

Possible Solution

solution to fix set billing address on cart

save: async (context: Context, params) => {
   Logger.debug('[Magento] setBillingAddress');
   const { id } = context.cart.cart.value;
   Logger.debug(id);
   Logger.debug(typeof id);
   const {
     apartment,
     sameAsShipping,
     ...address
   } = params.billingDetails;

   const setBillingAddressOnCartInput: SetBillingAddressOnCartInput = {
     cart_id: id,
     billing_address: {
       address: {
         ...address,
         street: [address.street, apartment],
       },
       same_as_shipping: sameAsShipping,
     },
   };

   const { data } = await context.$magento.api.setBillingAddressOnCart(setBillingAddressOnCartInput);

   /**
    * This is a workaround needed due to Magento GraphQL API
    * cleaning the Shipping method after defining the billing address
    */
   const shippingMethod = context.useShippingProvider.state.value;

   await context.useShippingProvider.save({
     shippingMethod: {
       carrier_code: shippingMethod.carrier_code,
       method_code: shippingMethod.method_code,
     },
   });
   /**
    * End of GraphQL Workaround
    */

   return data.setBillingAddressOnCart.cart.billing_address;
 },

Steps to reproduce

  1. sign in
  2. sign out
  3. sign in again (now vsf-cartId not generate)
  4. add product to cart (not working)
  5. in checkout, set billing address on cart (not working)

Version

1.0.0-rc.2

What browsers are you seeing the problem on?

Chrome

What node version you were using?

14.x

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: I can't click on product title on wishlist sidebar

Expected Behavior

If I click on product title on wishlist sidebar I should be redirected to product page.

Actual Behavior

If I click on product title on wishlist sidebar I'm not redirected to product page.

Possible Solution

No response

Steps to reproduce

  • Login to you account
  • Add a product to your wishlist
  • Click on product title
  • Nothing happens

What version of Magento 2 integration are you using?

Adobe Commerce 2.4.3 / VSF 1.0.0-rc.2

What version of Node.js are you using?

v14.17.5

What browser (and version) are you using?

Chrome 92.0.4515.159 (Official Build) (x86_64)

What operating system (and version) are you using?

Mac OSX

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

Improve user addresses management on MyAccount and Checkout process

Now in the Magento 2 connector, the user has on the MyAccount a Shipping address and billing address, but in Magento there is just on DB storage for addresses, and default for shipping and billing.


We need to improve the current model to look like this:

image


On the checkout process, we need to make sure there is just one group of addresses with the default billing on the billing step, the same for shipping.


If possible transform the composeables to have unique address management and update the client-API to do the same.

[Bug]: Increase / decrease product quantity from micro cart failed

Expected Behavior

I should be able to increase or decrease product quantity from micro cart.

Actual Behavior

I can't increase or decrease product quantity from micro cart.

{"graphQLErrors":[{"message":"The cart isn't active.","extensions":{"category":"graphql-no-such-entity"},"locations":[{"line":266,"column":3}],"path":["updateCartItems"]}],"networkError":null,"message":"GraphQL error: The cart isn't active."}

Possible Solution

No response

Steps to reproduce

  • Add a product to you cart
  • Open micro cart
  • Click + to increase or - to decrease quantity

What version of Magento 2 integration are you using?

Adobe Commerce 2.4.3 / VSF 1.0.0-rc.2

What version of Node.js are you using?

v14.17.5

What browser (and version) are you using?

Chrome 92.0.4515.159 (Official Build) (x86_64)

What operating system (and version) are you using?

Mac OSX

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: No notification on password change

Expected Behavior

When you change your password, you should see a notification.

Actual Behavior

When you change your password, you can't see any notification on screen.

Possible Solution

No response

Steps to reproduce

  • Login to your account
  • Access My Account / Change password
  • Change your password
  • You won't see any notification if it has success or fail

What version of Magento 2 integration are you using?

Adobe Commerce 2.4.3 / VSF 1.0.0-rc.2

What version of Node.js are you using?

v14.17.5

What browser (and version) are you using?

Chrome 92.0.4515.159 (Official Build) (x86_64)

What operating system (and version) are you using?

Mac OSX

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

Cannot query field "new" on type "SimpleProduct"

When trying to run the application with "yarn dev" i'm getting two error message saying as follow:

ERROR [VSF][error] [GraphQL error]: Message: Cannot query field "new" on type "SimpleProduct"., Location: [column: 7, line: 208], Path: undefined 21:52:59

ERROR [VSF][error] [GraphQL error]: Message: Cannot query field "sale" on type "SimpleProduct". Did you mean "name"?, Location: [column: 7, line: 212], Path: undefined 21:52:59

Steps to Reproduce (for bugs)

  1. Clone vuestorefront/template-magento
  2. run yarn
  3. setup conifg
  4. run yarn dev

Your Environment

  • Version used: 1.0.0.beta.08

[Bug]: No notification on personal data update

Expected Behavior

When you update your personal data, you should see a notification.

Actual Behavior

When you update your personal data, you can't see any notification on screen.

Possible Solution

No response

Steps to reproduce

  • Login to your account
  • Access My Account / Personal Data
  • Update your Personal Data
  • You won't see any notification if it has success or fail

What version of Magento 2 integration are you using?

Adobe Commerce 2.4.3 / VSF 1.0.0-rc.2

What version of Node.js are you using?

v14.17.5

What browser (and version) are you using?

Chrome 92.0.4515.159 (Official Build) (x86_64)

What operating system (and version) are you using?

Mac OSX

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Question] How to handle payments through external payment providers?

What is your question / Please describe your issue

How can we handle payments through external payment providers (e.g. Adyen, Stripe, Mollie)? It could be that I am asking this question in the wrong place, since it might apply to Vue Storefront in general. But since every integration could handle payments different, I figured I should ask it here.

Imagine I want to implement iDEAL by Mollie payments to finalize an order. How would I go about that? I cannot find much documentation about this.

What version of Magento 2 Integration are you using?

1.0.0-rc.2

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: update user address, address will always be set default_shipping: true

Expected Behavior

No response

Actual Behavior

export const transformUserUpdateAddressInput = (addressInputParams): {
  addressId: number;
  input: CustomerAddressInput;
} => {
  const {
    apartment,
    ...address
  } = addressInputParams.address;

  const addressParams: CustomerAddressInput = {
    ...address,
    street: [address.street, apartment],
  };

  return {
    // @ts-ignore
    addressId: params.address.id,
    input: {
      ...addressParams,
      default_shipping: true,
    },
  };
};

Possible Solution

remove this line
default_shipping: true

export const transformUserUpdateAddressInput = (addressInputParams): {
  addressId: number;
  input: CustomerAddressInput;
} => {
  const {
    apartment,
    ...address
  } = addressInputParams.address;

  const addressParams: CustomerAddressInput = {
    ...address,
    street: [address.street, apartment],
  };

  return {
    // @ts-ignore
    addressId: params.address.id,
    input: {
      ...addressParams,
    },
  };
};

Steps to reproduce

No response

What version of Magento 2 integration are you using?

1.0.0-rc.2

What version of Node.js are you using?

14.x

What browser (and version) are you using?

Chrome

What operating system (and version) are you using?

macOS

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: Forgotten password link is broken

Expected Behavior

When I click on Forgotten password link, I should be able to reset my password if I have an account.

Actual Behavior

When I click on Forgotten password link, nothing happens.

Possible Solution

No response

Steps to reproduce

  • Click on My Account icon
  • Click on Forgotten Password link
  • Nothing happens

What version of Magento 2 integration are you using?

Adobe Commerce 2.4.3 / VSF 1.0.0-rc.2

What version of Node.js are you using?

v14.17.5

What browser (and version) are you using?

Chrome 92.0.4515.159 (Official Build) (x86_64)

What operating system (and version) are you using?

Mac OSX

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: Shipping price is not applyed to order total price

Expected Behavior

When order is created shipping price is added to order and displayed on order totals
Selection_079

Actual Behavior

    • Order totals are displayed without shipping price ❌
    • Shipping price is send to M2 right ✔️
    • Order total is sent to M2 wrong (and will have influence on payment) ❌
      Selection_078
      Selection_080
      Selection_081

Possible Solution

No response

Steps to reproduce

  1. Add product to basket
  2. Proceed to checkout
  3. Select shipping with price
  4. Proceed to order summary page
  5. Observe

What version of Magento 2 integration are you using?

2.4.3

What version of Node.js are you using?

14.17.4

What browser (and version) are you using?

Chrome, FF

What operating system (and version) are you using?

Ubuntu 20.04

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: Clicking on product image thumbnails don't update main product image

Expected Behavior

If I click on a product image thumbnail on product page, it should change the main image display on screen.

Actual Behavior

Nothing happen if I click on a product image thumbnail on product page.

For information, on direct access to a product page, if I click on a product image thumbnail, it switches it to the main image correctly.

Possible Solution

No response

Steps to reproduce

  • Browse home page
  • Click on a product inside New Products block
  • Click on a product image thumbnail
  • Nothing happens

What version of Magento 2 integration are you using?

Adobe Commerce 2.4.3 / VSF 1.0.0-rc.2

What version of Node.js are you using?

v14.17.5

What browser (and version) are you using?

Chrome 92.0.4515.159 (Official Build) (x86_64)

What operating system (and version) are you using?

Mac OSX

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

Error 'params is not defined' when update shipping address

Expected Behavior

Current Behavior

Screen Shot 2021-06-18 at 13 24 52

Possible Solution

Screen Shot 2021-06-18 at 13 38 15

change params to addressInputParams in
return {
// @ts-ignore
addressId: addressInputParams.address.id,
input: {
...addressParams,
default_shipping: true,
},
};

Steps to Reproduce (for bugs)

when update shipping addres

Context

Your Environment

  • Version used: 1.0.0-beta.14

Create dynamic AppHeader.vue

We need to create a dynamic AppHeader.vue component that request the categories from the store and displays as the menu for the client.

[Bug]: Cannot query field "swatch_data" on type "ConfigurableProductOptionsValues"

Expected Behavior

I should be able to see categories in header navigation menu and browse category / product pages.

Actual Behavior

When I launch build I can see the following error several times as output:
ERROR [VSF][error]: [GraphQL error]: Message: Cannot query field "swatch_data" on type "ConfigurableProductOptionsValues"., Location: [column: 7, line: 94], Path: undefined

I can't:

  • see categories on header navigation menu
  • access a category
  • access a product page
  • search for a product

Possible Solution

No response

Steps to reproduce

Run yarn && yarn dev and check output:
ERROR [VSF][error]: [GraphQL error]: Message: Cannot query field "swatch_data" on type "ConfigurableProductOptionsValues"., Location: [column: 7, line: 94], Path: undefined 15:37:45

What version of Magento 2 integration are you using?

Adobe Commerce 2.4.3

What version of Node.js are you using?

v14.17.5

What browser (and version) are you using?

Chrome 92.0.4515.159 (Official Build) (x86_64)

What operating system (and version) are you using?

Mac OSX

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: Direct access a product that doesn't exist

Expected Behavior

If you access a fake product URL, you should have a 404 content page with HTTP code 404.

Actual Behavior

If you access a fake product URL, you have a product page with a 200 HTTP Code and a product name as undefined, price as USD 0,00.

Possible Solution

  • Show a 404 CMS page
  • Send a 404 HTTP Code to browser = SEO Best Practice for not found pages

Steps to reproduce

No response

What version of Magento 2 integration are you using?

Adobe Commerce 2.4.3 / VSF 1.0.0-rc.2

What version of Node.js are you using?

v14.17.5

What browser (and version) are you using?

Chrome 92.0.4515.159 (Official Build) (x86_64)

What operating system (and version) are you using?

Mac OSX

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: Pagination on product list pages is broken

Expected Behavior

Pagination on product list page (for example category page) works fine

Actual Behavior

Links in pagination bar looks like https://vsf.mediabridge.solutions/c/[object%20Object] , what produces error on pagination switch

Possible Solution

  • After investigation it was found the bug is produced by changes in Storefront-UI: vuestorefront/storefront-ui@253a30f
  • This changes were reverted: vuestorefront/storefront-ui#1883
  • But storefront-ui is not updated to version it's fixed because of wrong release version (the fix is in 0.10.8, but broken is 0.10.71 which is bigger)
  • The bugreport is left on storefront-ui page: vuestorefront/storefront-ui#1952
  • This bug report is created for documentation and next steps. If vuestorefront/storefront-ui#1952 will be resolved fast by storefront-ui team no more actions are required from our side, otherwise we would need to update stroefront-ui library version in package.json (to be > 0.10.7 and < 0.10.71)

Steps to reproduce

  1. Open category page (ex. https://vsf.mediabridge.solutions/c/women.html )
  2. Click page numbers in pagination bar
  3. Observe

What version of Magento 2 integration are you using?

2.4.3

What version of Node.js are you using?

14.17.4

What browser (and version) are you using?

Chrome, FF

What operating system (and version) are you using?

Ubuntu 20.04

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: Discount is displayed wrong on checkout step

Expected Behavior

Discount is displayed like on M2 FE:
Selection_082

Actual Behavior

Discount is not displayed in basket overlay
Discount is displayed wrong on order summary page

Selection_084
Selection_083

Possible Solution

No response

Steps to reproduce

  1. Pick up product with discount (for example this product https://vsf.mediabridge.solutions/p/WH11/eos-v-neck-hoodie.html has discount if qty >= 4 )
  2. Add necessary quantity to basket
  3. Observe basket overlay
  4. Navigate to checkout
  5. Observe checkout summary page

What version of Magento 2 integration are you using?

develop

What version of Node.js are you using?

14.17.4

What browser (and version) are you using?

Chrome, FF

What operating system (and version) are you using?

Ubuntu 20.04

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[ROADMAP] Magento 2 - VueStorefront 2

This is an early-stage roadmap with some of the features that are needed, to have a complete store running and be able to be production-ready.


Product

  • Display Customizable Product #22
  • Configure a Customizable Product to be able to add to cart #22
  • Access a Customizable Product URL with options, and those settings get applied #22
  • Add Product Review #86
  • Display product attributes and extra information #22

Category

  • Display the filter sidebar #20 #99

User

  • Create the Wishlist Process #102
  • Manage Newletters on Magento #93

Checkout

External Checkout

  • Create the external checkout process
  • ThankYou page #24
  • Create the external checkout Magento 2 Plugin

Internal Checkout

  • Create the internal checkout process #24
  • Develop the checkout process for Guest User #24
  • Develop the checkout process for Authenticated User #24
  • ThankYou page #24
  • Coupon and Discount codes process #24

Better detail needed in repo contribution instructions

Expected Behavior

Contributing instructions should be more detailed to avoid confusion

Current Behavior

Some information and defaults are either missing on causing confusion when setting up the repo for contribution and getting the project running locally.

Possible Solution

Steps to Reproduce (for bugs)

Setting up repo with current information results in problems and questions

Context

Was not able to get project running without @bloodf help

Your Environment

  • Version used: 1.0.0-beta.1
  • Browser Name and version: Chrome
  • Operating System and version (desktop or mobile): Windows/WSL2 (Ubuntu 20.14)

I will submit a PR for this

[Bug]: Not all subcategories and products are loaded

Expected Behavior

When VSF is connected to sample M2 data the categories and products in categories are loaded like on M2 FE ( https://vsf-magento.mediabridge.solutions/women.html ) or like on VSF1 demo ( https://capybara.storefrontcloud.io/women.html, https://demo.vuestorefront.io/women.html )

Actual Behavior

Some categories are displayed, but their subcategories and products inside are not loaded. Instead products and subcategories from other categories are displayed: https://vsf.mediabridge.solutions/c/women.html

Possible Solution

Not clear yet what produces such behavior and how to fix it. Still in investigation process.

The reason could be way how products are assigned to categories in M2: if product is assigned to subcategory it does not automatically means it's also belongs to main category.

Selection_065

Steps to reproduce

  1. Open demo shop connected to Magento 2 sample data
  2. Click 'Women' or 'Men' category ( https://vsf.mediabridge.solutions/c/women.html )
  3. Observe products
  4. Observe subcategories in left sidebar

What version of Magento 2 integration are you using?

2.4.3

What version of Node.js are you using?

14.17.4

What browser (and version) are you using?

Chrome, FF

What operating system (and version) are you using?

Ubuntu 20.04

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: Direct access a category that doesn't exist

Expected Behavior

If you access a fake category URL, you should have a 404 content page with HTTP code 404.

Actual Behavior

If you access a fake category URL, you have a 500 HTTP Code and error page.

Possible Solution

  • Show a 404 CMS page
  • Send a 404 HTTP Code to browser = SEO Best Practice for not found pages

Steps to reproduce

No response

What version of Magento 2 integration are you using?

Adobe Commerce 2.4.3 / VSF 1.0.0-rc.2

What version of Node.js are you using?

v14.17.5

What browser (and version) are you using?

Chrome 92.0.4515.159 (Official Build) (x86_64)

What operating system (and version) are you using?

Mac OSX

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: add product to cart not working after place order

Contact Details

[email protected]

Expected Behavior

No response

Actual Behavior

loop infinity

Screen Shot 2021-08-11 at 17 54 28

Possible Solution

No response

Steps to reproduce

  1. login
  2. add product to cart
  3. place oder
  4. add product to cart

Version

1.0.0-rc.2

What browsers are you seeing the problem on?

Chrome

What node version you were using?

14.x

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Feature]: Do not create an empty cart automatically

How the project can be improved?

Actually when you access VSF2 it automatically creates an empty cart.

Most users and bots only visit pages and don't perform an add to cart action at all. Why flood M2 database with empty carts all the time?

Cart should only be created when a product is added to the cart.

What are the acceptance criteria?

  • Direct access a page and verify that an empty cart is not created anymore

Additional information

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

Cannot connect to Magento, "TypeError: Only absolute URLs are supported" + useCart/load 500 error

Expected Behavior

VSF should connect to my Magento site and load products

Current Behavior

No products appear on the page, but I receive connection errors in the console:
ERROR [VSF][error] [Network error]: TypeError: Only absolute URLs are supported 21:27:31

ERROR [VSF][error] useCart/load Request failed with status code 500 21:27:31

at createError (/Users/markwlodawski/dev/vsf2ports-magento/magento2/node_modules/axios/lib/core/createError.js:16:15)
at settle (/Users/markwlodawski/dev/vsf2ports-magento/magento2/node_modules/axios/lib/core/settle.js:17:12)
at IncomingMessage.handleStreamEnd (/Users/markwlodawski/dev/vsf2ports-magento/magento2/node_modules/axios/lib/adapters/http.js:260:11)
at IncomingMessage.emit (events.js:327:22)
at endReadableNT (_stream_readable.js:1220:12)
at processTicksAndRejections (internal/process/task_queues.js:84:21)

Possible Solution

I'm not sure whether this is related to Axios, Apollo, or

Steps to Reproduce (for bugs)

Context

I actually first had this issue a few days ago when my Magento site was still located only at its static IP address, so I spent a couple of days directing the nameservers of mqexports.com to the Magento installation, hosted on Google Cloud services, hoping the problem would go away. Apparently, it wasn't the source of the problem, because now the issue is still there.

Your Environment

  • Version used: VSF 2, Magento 2.4.2
  • Browser Name and version: Chrome 90
  • Operating System and version (desktop or mobile): MacBook Pro 2019
  • Link to your project: https://github.com/IMakeTheSites/vsf-exports
    My .env file's content:

MAGENTO_GRAPHQL=https://mqexports.com/graphql
MAGENTO_EXTERNAL_CHECKOUT=https://mqexports.com
MAGENTO_EXTERNAL_CHECKOUT_SYNC_PATH=/vue/cart/sync

Vetur not recognizing setup return

Expected Behavior

image

Current Behavior

image

Possible Solution

What i did to solve this was to use @vue/composition-api defineComponent function wrapping vue template on it.
image

Steps to Reproduce (for bugs)

Every component and pages of the application have this problem...

Your Environment

  • Version used: Using develop branch
  • Vetur version: v0.33.1

Adjust file source MyProfile to MyProfile.vue in MyAccount.vue

In develop branch at step 8 when running yarn dev:theme file I got error message "file was not found" in a nutshell.

in packages/theme/pages/MyAccount.vue on line 50

import MyProfile from './MyAccount/MyProfile';

should be changed to

import MyProfile from './MyAccount/MyProfile.vue';

[Bug]: Direct access to a CMS page that doesn't exist

Expected Behavior

If you access a fake page URL, you should have a 404 content page with HTTP code 404.

Actual Behavior

If you access a fake page URL, you have a 500 HTTP Code and error page.

Possible Solution

  • Show a 404 CMS page
  • Send a 404 HTTP Code to browser = SEO Best Practice for not found pages

Steps to reproduce

  • Access a fake link
  • You will have a 500 error page instead of a 404

What version of Magento 2 integration are you using?

Adobe Commerce 2.4.3 / VSF 1.0.0-rc.2

What version of Node.js are you using?

v14.17.5

What browser (and version) are you using?

Chrome 92.0.4515.159 (Official Build) (x86_64)

What operating system (and version) are you using?

Mac OSX

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: Update newsletter subscription preference doesn't work

Expected Behavior

Update my newsletter subscription should work.

Actual Behavior

I can't update my newsletter subscription option:

It's actually calling /api/magento/updateCustomerEmail endpoint posting [{}] 0: {}

{"graphQLErrors":[{"message":"Variable \"$email\" of required type \"String!\" was not provided.\n\nVariable \"$password\" of required type \"String!\" was not provided.","extensions":{"category":"graphql"}}],"networkError":null,"message":"GraphQL error: Variable \"$email\" of required type \"String!\" was not provided.\n\nVariable \"$password\" of required type \"String!\" was not provided."}

Possible Solution

No response

Steps to reproduce

  • Login to your account
  • Go to your Account / Newsletter
  • Update you preference
  • You have an error in your Dev Tools console

What version of Magento 2 integration are you using?

Adobe Commerce 2.4.3 / VSF 1.0.0-rc.2

What version of Node.js are you using?

v14.17.5

What browser (and version) are you using?

Chrome 92.0.4515.159 (Official Build) (x86_64)

What operating system (and version) are you using?

Mac OSX

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

[Bug]: I can't click on product title on micro cart

Expected Behavior

If I click on product title on micro cart I should be redirected to product page.

Actual Behavior

If I click on product title on micro cart I'm not redirected to product page.

Possible Solution

No response

Steps to reproduce

  • Add a product to your cart
  • Click on product title
  • Nothing happens

What version of Magento 2 integration are you using?

Adobe Commerce 2.4.3 / VSF 1.0.0-rc.2

What version of Node.js are you using?

v14.17.5

What browser (and version) are you using?

Chrome 92.0.4515.159 (Official Build) (x86_64)

What operating system (and version) are you using?

Mac OSX

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

Checkout Flow

It need to implement the Complete checkout flow through the VueStorefront client. removing the mocked data.

[Bug]: Complete loading during navigation

Expected Behavior

In guest mode, when I browse from homepage to PLP and PDP, we should have a smooth transition without a complete loading page.

It should only load missing components from the new page we are accessing.

Actual Behavior

In guest mode, when I browse from homepage to PLP and PDP, I can see a blank page and a full loading page, assets load again.

It seems we don't have smooth PWA effect loading only missing components from the new page we are accessing.

Possible Solution

No response

Steps to reproduce

  • Browse website in guest mode
  • You will see a blank page between the pages you browse

What version of Magento 2 integration are you using?

Adobe Commerce 2.4.3 / VSF 1.0.0-rc.2

What version of Node.js are you using?

v14.17.5

What browser (and version) are you using?

Chrome 92.0.4515.159 (Official Build) (x86_64)

What operating system (and version) are you using?

Mac OSX

Relevant log output

No response

Code of Conduct

  • I agree to follow this project's Code of Conduct

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.