Local Server Theme Testing for SuiteCommerce Customizations

Testing your SuiteCommerce theme customizations locally is an essential step before deploying to NetSuite. This approach enables you to ensure functionality and design accuracy without impacting your live environment.

Why Test Locally?

Running tests on a local server allows you to verify frontend changes effectively. However, it's important to understand that deploying and activating your theme in NetSuite is necessary to see changes made to skins or Sass variables specified in the SuiteCommerce Template.

How to Test Your Theme on a Local Server

To set up and test your theme locally, follow these steps:

1. Open Your Command Line: Navigate to your local developer environment and open a command line or terminal, accessing your top-level development directory.

2. Run the Command:

   bashCopy

   gulp theme:local

   Warning: Running this command compiles and deploys your theme to a local server while updating the manifest.json file. Any manual edits to this file will be lost unless you run:

   bashCopy

   gulp theme:local --preserve-manifest

   This command will help to preserve any manual changes you made to your manifest.json file, which is crucial for maintaining custom configurations.

3. Access Your Local Theme: After executing the command, you can view your theme in a browser using URL patterns:

   • For shopping: http://<DOMAIN_NAME>/c.<ACCOUNT_ID>/<SSP_APPLICATION>/shopping-local.ssp
   • For my account: http://<DOMAIN_NAME>/c.<ACCOUNT_ID>/<SSP_APPLICATION>/my_account-local.ssp
   • For checkout: http://<DOMAIN_NAME>/c.<ACCOUNT_ID>/<SSP_APPLICATION>/checkout-local.ssp

   Be sure to replace the placeholders with your specific settings:

   Variable	Replacement	Example
   DOMAIN_NAME	Your NetSuite website record domain.	http://www.mysite.com
   ACCOUNT_ID	Your NetSuite account ID.	c.123456
   SSP_APPLICATION	The URL root for your SuiteCommerce implementation, e.g. scs for SuiteCommerce, sca-dev-... for SuiteCommerce Advanced.	scs or sca-dev-aconcagua

Important Notes

• If you make additional changes or add new files after the local server launch, remember to rerun the gulp theme:local command to ensure those updates are included.

What Happens When You Test a Theme?

Executing the gulp theme:local command compiles the theme's source files (including extensions) to a LocalDistribution/tmp directory, where your customized application is served from. Gulp.js also initializes watch tasks for automatic updates when files change, allowing for real-time testing of your modifications.

Next Steps

After successfully testing your theme, you are ready to deploy it to NetSuite. Refer to the documentation on Deploying a Theme to NetSuite for step-by-step instructions. Remember to activate your theme for your chosen website domain afterwards to apply the changes.

Key Takeaways

• Local testing ensures frontend changes function correctly before deployment.
• Use command-line Gulp commands to compile and check your theme.
• Preserve your manifest.json changes during local server use.
• Remember to refresh the local setup after any modifications.
• Deployment follows successful local testing to NetSuite.

Source: This article is based on Oracle's official NetSuite documentation.