This is a follow up on this post.
In the first part we saw how we can extend the CRT to include additional fields in the extension properties, and how to surface that in your own 'Dynamics 365 Commerce - Ecom' custom module.
In this section I'm going to add that field to the 'Add to cart' process.
If you recall, we added an 'Is Warranty' flag to the product table, and we want to produce a message to the end user when they add this item to their cart. It will inform them that the item does not have warranty, and asks them to confirm that they want to buy it.
Since we are going to add logic to the cart (buybox), we need to be able to mimic adding items to the cart. However, that is not easy when you don't have a full blown Ecom site linked to your dev box.
I think technically it should be possible by setting up a page mock, but I could not get this to work.
However, you can actually use your Test environment's Ecom site for this.
By configuring your .env file to use your Test environment's Ecom site and server, you can use all the site's functionality and data setup while running your Ecom mods locally.
To do this, point all the variables in your .env file to the test environment.
Then when you access https://:4000 it will render test site and all its data, but loads the code locally.
We'll see further below that we use a custom theme to extend the functionality, and by specifying the theme in our url (with a parameter) we can run the custom code.
Since I want to add a dialog/message box to the 'add to cart' process, I initially thought I had to change the buybox module.
However Sam Jarawan from Micsrosoft pointed to an easier solution:
This poses the question; how do we override this?
If you must change any logic in a component, you can use the command-line interface (CLI) add-component-override command to override the component for a selected theme.
First we need to either create or extend a theme.
Create a new theme using the CLI. (You do this in your Visual Code terminal window):
yarn mdsyn365 add-theme itk
Make sure to include the styles per here.
Now that we have a theme, we can add our component override to it:
yarn msdyn365 add-component-override itk AddToCart
We start the local server:
Beauty! It works!
Next step: Use the new field in the alert message.
Then if we test again, but this time using an item that does have the custom warranty flag set, we do not get the message.
The code needs to be adjusted to actually add, or not add the item to the cart based on the user's response, but the example at least shows the concept.