How to preview the app without activating it?

You can enable the preview mode, allowing you to preview edits before saving and publishing changes to your app widget, even when the app is disabled.

Meaning that if you want to keep the Collections Add to Cart app disabled while you get the buttons tuned as you wish, before displaying them on your Live store, you can do it with no issues. 

To enable the preview mode, you just need to access the Advanced preferences section on the app preferences page, and then click on the checkbox to activate it.

Once enabled, the 'Preview' button will be displayed automatically on the top menu. 

Note: By default, it will only preview the collections/all store page automatically, not other pages such as product pages, search result pages, or specific collections. However, if you want to preview it on other pages, you can add ?previewCollectionsApp=& at the end of the page URL.

The preview mode uses an additional app ScriptTag allowing to preview the app even when it is disabled. The ScriptTag is a Shopify programming feature (see https://help.shopify.com/en/api/reference/online-store/scripttag for details) that allows our app to be injected dynamically by Shopify when a page loads. Therefore, our app does not need to modify any of your templates to run nicely in your store. 

In addition, our script file is cached in the browser so it will not consume network resources after the first download. See Is the app script file optimised? for more information about it.