shopify-cli 2.8.0 → 2.9.0

data/lib/project_types/theme/commands/pull.rb

@@ -9,7 +9,9 @@ module Theme
       options do |parser, flags|
         parser.on("-n", "--nodelete") { flags[:nodelete] = true }
         parser.on("-i", "--themeid=ID") { |theme_id| flags[:theme_id] = theme_id }
+        parser.on("-t", "--theme=NAME_OR_ID") { |theme| flags[:theme] = theme }
         parser.on("-l", "--live") { flags[:live] = true }
+        parser.on("-d", "--development") { flags[:development] = true }
         parser.on("-x", "--ignore=PATTERN") do |pattern|
           flags[:ignores] ||= []
           flags[:ignores] << pattern
@@ -19,21 +21,8 @@ module Theme
       def call(args, _name)
         root = args.first || "."
         delete = !options.flags[:nodelete]
-
-        theme = if (theme_id = options.flags[:theme_id])
-          ShopifyCLI::Theme::Theme.new(@ctx, root: root, id: theme_id)
-        elsif options.flags[:live]
-          ShopifyCLI::Theme::Theme.live(@ctx, root: root)
-        else
-          form = Forms::Select.ask(
-            @ctx,
-            [],
-            title: @ctx.message("theme.pull.select"),
-            root: root,
-          )
-          return unless form
-          form.theme
-        end
+        theme = find_theme(root, **options.flags)
+        return if theme.nil?
 
         ignore_filter = ShopifyCLI::Theme::IgnoreFilter.from_path(root)
         ignore_filter.add_patterns(options.flags[:ignores]) if options.flags[:ignores]
@@ -46,7 +35,7 @@ module Theme
           end
           @ctx.done(@ctx.message("theme.pull.done"))
         rescue ShopifyCLI::API::APIRequestNotFoundError
-          @ctx.abort(@ctx.message("theme.pull.theme_not_found", theme.id))
+          @ctx.abort(@ctx.message("theme.pull.theme_not_found", "##{theme.id}"))
         ensure
           syncer.shutdown
         end
@@ -55,6 +44,40 @@ module Theme
       def self.help
         ShopifyCLI::Context.message("theme.pull.help", ShopifyCLI::TOOL_NAME, ShopifyCLI::TOOL_NAME)
       end
+
+      private
+
+      def find_theme(root, theme_id: nil, theme: nil, live: nil, development: nil, **_args)
+        if theme_id
+          @ctx.warn(@ctx.message("theme.pull.deprecated_themeid"))
+          return ShopifyCLI::Theme::Theme.new(@ctx, root: root, id: theme_id)
+        end
+
+        if theme
+          selected_theme = ShopifyCLI::Theme::Theme.find_by_identifier(@ctx, root: root, identifier: theme)
+          return selected_theme || @ctx.abort(@ctx.message("theme.pull.theme_not_found", theme))
+        end
+
+        if live
+          return ShopifyCLI::Theme::Theme.live(@ctx, root: root)
+        end
+
+        if development
+          return ShopifyCLI::Theme::Theme.development(@ctx, root: root)
+        end
+
+        select_theme(root)
+      end
+
+      def select_theme(root)
+        form = Forms::Select.ask(
+          @ctx,
+          [],
+          title: @ctx.message("theme.pull.select"),
+          root: root,
+        )
+        form&.theme
+      end
     end
   end
 end

data/lib/project_types/theme/commands/push.rb

@@ -10,6 +10,7 @@ module Theme
       options do |parser, flags|
         parser.on("-n", "--nodelete") { flags[:nodelete] = true }
         parser.on("-i", "--themeid=ID") { |theme_id| flags[:theme_id] = theme_id }
+        parser.on("-t", "--theme=NAME_OR_ID") { |theme| flags[:theme] = theme }
         parser.on("-l", "--live") { flags[:live] = true }
         parser.on("-d", "--development") { flags[:development] = true }
         parser.on("-u", "--unpublished") { flags[:unpublished] = true }
@@ -25,30 +26,8 @@ module Theme
       def call(args, _name)
         root = args.first || "."
         delete = !options.flags[:nodelete]
-
-        theme = if (theme_id = options.flags[:theme_id])
-          ShopifyCLI::Theme::Theme.new(@ctx, root: root, id: theme_id)
-        elsif options.flags[:live]
-          ShopifyCLI::Theme::Theme.live(@ctx, root: root)
-        elsif options.flags[:development]
-          theme = ShopifyCLI::Theme::DevelopmentTheme.new(@ctx, root: root)
-          theme.ensure_exists!
-          theme
-        elsif options.flags[:unpublished]
-          name = CLI::UI::Prompt.ask(@ctx.message("theme.push.name"), allow_empty: false)
-          theme = ShopifyCLI::Theme::Theme.new(@ctx, root: root, name: name, role: "unpublished")
-          theme.create
-          theme
-        else
-          form = Forms::Select.ask(
-            @ctx,
-            [],
-            title: @ctx.message("theme.push.select"),
-            root: root,
-          )
-          return unless form
-          form.theme
-        end
+        theme = find_theme(root, **options.flags)
+        return if theme.nil?
 
         if theme.live? && !options.flags[:allow_live]
           question = @ctx.message("theme.push.live")
@@ -78,16 +57,67 @@ module Theme
             end
           end
           raise ShopifyCLI::AbortSilent if syncer.has_any_error?
-        rescue ShopifyCLI::API::APIRequestNotFoundError
-          @ctx.abort(@ctx.message("theme.push.theme_not_found", theme.id))
         ensure
           syncer.shutdown
         end
+      rescue ShopifyCLI::API::APIRequestNotFoundError
+        @ctx.abort(@ctx.message("theme.push.theme_not_found", "##{theme.id}"))
       end
 
       def self.help
         ShopifyCLI::Context.message("theme.push.help", ShopifyCLI::TOOL_NAME, ShopifyCLI::TOOL_NAME)
       end
+
+      private
+
+      def find_theme(root, theme_id: nil, theme: nil, live: nil, development: nil, unpublished: nil, **_args)
+        if theme_id
+          @ctx.warn(@ctx.message("theme.push.deprecated_themeid"))
+          return ShopifyCLI::Theme::Theme.new(@ctx, root: root, id: theme_id)
+        end
+
+        if live
+          return ShopifyCLI::Theme::Theme.live(@ctx, root: root)
+        end
+
+        if development
+          new_theme = ShopifyCLI::Theme::DevelopmentTheme.new(@ctx, root: root)
+          new_theme.ensure_exists!
+          return new_theme
+        end
+
+        if unpublished
+          name = theme || ask_theme_name
+          new_theme = ShopifyCLI::Theme::Theme.new(@ctx, root: root, name: name, role: "unpublished")
+          new_theme.create
+          return new_theme
+        end
+
+        if theme
+          selected_theme = ShopifyCLI::Theme::Theme.find_by_identifier(@ctx, root: root, identifier: theme)
+          return selected_theme || @ctx.abort(@ctx.message("theme.push.theme_not_found", theme))
+        end
+
+        select_theme(root)
+      end
+
+      def ask_theme_name
+        CLI::UI::Prompt.ask(@ctx.message("theme.push.name"), allow_empty: false)
+      end
+
+      def select_theme(root)
+        form = Forms::Select.ask(
+          @ctx,
+          [],
+          title: @ctx.message("theme.push.select"),
+          root: root,
+        )
+        form&.theme
+      end
+
+      def themes(root)
+        ShopifyCLI::Theme::Theme.all(@ctx, root: root)
+      end
     end
   end
 end

data/lib/project_types/theme/commands/serve.rb

@@ -10,6 +10,7 @@ module Theme
         parser.on("--host=HOST") { |host| flags[:host] = host.to_s }
         parser.on("--port=PORT") { |port| flags[:port] = port.to_i }
         parser.on("--poll") { flags[:poll] = true }
+        parser.on("--live-reload=MODE") { |mode| flags[:mode] = as_reload_mode(mode) }
       end
 
       def call(*)
@@ -23,6 +24,10 @@ module Theme
           ShopifyCLI::Context.message("theme.serve.error.address_binding_error", ShopifyCLI::TOOL_NAME)
       end
 
+      def self.as_reload_mode(mode)
+        ShopifyCLI::Theme::DevServer::ReloadMode.get!(mode)
+      end
+
       def self.help
         ShopifyCLI::Context.message("theme.serve.help", ShopifyCLI::TOOL_NAME)
       end

data/lib/project_types/theme/messages/messages.rb

@@ -57,14 +57,14 @@ module Theme
               Usage: {{command:%s theme push [ ROOT ]}}
 
               Options:
-                {{command:-i, --themeid=THEMEID}} Theme ID. Must be an existing theme on your store.
-                {{command:-l, --live}}            Push to your remote live theme, and update your live store.
-                {{command:-d, --development}}     Push to your remote development theme, and create it if needed.
-                {{command:-u, --unpublished}}     Create a new unpublished theme and push to it.
-                {{command:-n, --nodelete}}        Runs the push command without deleting remote files from Shopify.
-                {{command:-j, --json}}            Output JSON instead of a UI.
-                {{command:-a, --allow-live}}      Allow push to a live theme.
-                {{command:-p, --publish}}         Publish as the live theme after uploading.
+                {{command:-t, --theme=NAME_OR_ID}} Theme ID or name of the remote theme.
+                {{command:-l, --live}}             Push to your remote live theme, and update your live store.
+                {{command:-d, --development}}      Push to your remote development theme, and create it if needed.
+                {{command:-u, --unpublished}}      Create a new unpublished theme and push to it.
+                {{command:-n, --nodelete}}         Runs the push command without deleting remote files from Shopify.
+                {{command:-j, --json}}             Output JSON instead of a UI.
+                {{command:-a, --allow-live}}       Allow push to a live theme.
+                {{command:-p, --publish}}          Publish as the live theme after uploading.
 
               Run without options to select theme from a list.
           HELP
@@ -75,7 +75,10 @@ module Theme
           select: "Select theme to push to",
           live: "Are you sure you want to push to your live theme?",
           theme: "\n  Theme: {{blue:%s #%s}} {{green:[live]}}",
-          theme_not_found: "Theme #%s doesn't exist",
+          deprecated_themeid: <<~WARN,
+            {{warning:The {{command:-i, --themeid}} flag is deprecated. Use {{command:-t, --theme}} instead.}}
+          WARN
+          theme_not_found: "Theme \"%s\" doesn't exist",
           done: <<~DONE,
             {{green:Your theme was pushed successfully}}
 
@@ -94,10 +97,16 @@ module Theme
             Usage: {{command:%s theme serve}}
 
             Options:
-              {{command:--port=PORT}} Local port to serve theme preview from
-              {{command:--poll}}      Force polling to detect file changes
-              {{command:--host=HOST}} Set which network interface the web server listens on. The default value is 127.0.0.1.
+              {{command:--port=PORT}}        Local port to serve theme preview from.
+              {{command:--poll}}             Force polling to detect file changes.
+              {{command:--host=HOST}}        Set which network interface the web server listens on. The default value is 127.0.0.1.
+              {{command:--live-reload=MODE}} The live reload mode switches the server behavior when a file is modified:
+                                 - {{command:hot-reload}} Hot reloads local changes to CSS and sections (default)
+                                 - {{command:full-page}}  Always refreshes the entire page
+                                 - {{command:off}}        Deactivate live reload
           HELP
+          reload_mode_is_not_valid: "The live reload mode `%s` is not valid.",
+          try_a_valid_reload_mode: "Try a valid live reload mode: %s.",
           viewing_theme: "Viewing theme…",
           syncing_theme: "Syncing theme #%s on %s",
           open_fail: "Couldn't open the theme",
@@ -131,9 +140,7 @@ module Theme
             You are not authorized to edit themes on %s.
             Make sure you are a user of that store, and allowed to edit themes.
           ENSURE_USER
-          already_in_use_error: "Error",
           address_already_in_use: "The address \"%s\" is already in use.",
-          try_this: "Try this",
           try_port_option: "Use the --port=PORT option to serve the theme in a different port.",
         },
         check: {
@@ -189,16 +196,20 @@ module Theme
             Usage: {{command:%s theme pull [ ROOT ]}}
 
             Options:
-              {{command:-i, --themeid=THEMEID}} The Theme ID. Must be an existing theme on your store.
-              {{command:-l, --live}}            Pull theme files from your remote live theme.
-              {{command:-n, --nodelete}}        Runs the pull command without deleting local files.
+              {{command:-t, --theme=NAME_OR_ID}} Theme ID or name of the remote theme.
+              {{command:-l, --live}}             Pull theme files from your remote live theme.
+              {{command:-d, --development}}      Pull theme files from your remote development theme.
+              {{command:-n, --nodelete}}         Runs the pull command without deleting local files.
 
             Run without options to select theme from a list.
           HELP
           select: "Select a theme to pull from",
           pulling: "Pulling theme files from %s (#%s) on %s",
           done: "Theme pulled successfully",
-          not_found: "{{x}} Theme #%s doesn't exist",
+          deprecated_themeid: <<~WARN,
+            {{warning:The {{command:-i, --themeid}} flag is deprecated. Use {{command:-t, --theme}} instead.}}
+          WARN
+          theme_not_found: "Theme \"%s\" doesn't exist",
         },
       },
     }.freeze

data/lib/shopify_cli/commands/login.rb

@@ -15,8 +15,6 @@ module ShopifyCLI
 
       def call(*)
         shop = (options.flags[:shop] || @ctx.getenv("SHOPIFY_SHOP" || nil))
-        ShopifyCLI::DB.set(shop: self.class.validate_shop(shop, context: @ctx)) unless shop.nil?
-
         if shop.nil? && Shopifolk.check
           Shopifolk.reset
           @ctx.puts(@ctx.message("core.tasks.select_org_and_shop.identified_as_shopify"))
@@ -33,17 +31,25 @@ module ShopifyCLI
           IdentityAuth.new(ctx: @ctx).authenticate
           org = select_organization
           ShopifyCLI::DB.set(organization_id: org["id"].to_i) unless org.nil?
-          Whoami.call([], "whoami")
+
         end
+        # validate that shop belongs to organization
+        ShopifyCLI::DB.set(shop: self.class.validate_shop(shop: shop, org: org, context: @ctx)) unless shop.nil?
+        Whoami.call([], "whoami")
       end
 
       def self.help
         ShopifyCLI::Context.message("core.login.help", ShopifyCLI::TOOL_NAME)
       end
 
-      def self.validate_shop(shop, context:)
+      def self.validate_shop(shop:, org:, context:)
         permanent_domain = shop_to_permanent_domain(shop)
         context.abort(context.message("core.login.invalid_shop", shop)) unless permanent_domain
+        if org
+          stores_owned = org["stores"]
+          is_verified = stores_owned.any? { |store| store["shopDomain"] == permanent_domain }
+          context.abort(context.message("core.login.invalid_shop", shop)) unless is_verified
+        end
         permanent_domain
       end
 

data/lib/shopify_cli/constants.rb

@@ -30,6 +30,7 @@ module ShopifyCLI
 
     module EnvironmentVariables
       STACKTRACE = "SHOPIFY_CLI_STACKTRACE"
+      TTY = "SHOPIFY_CLI_TTY"
 
       # When true the CLI points to a local instance of
       # the partners dashboard and identity.

data/lib/shopify_cli/context.rb

@@ -44,6 +44,56 @@ module ShopifyCLI
         str = Context.messages.dig(*key_parts)
         str ? str % params : key
       end
+
+      # a wrapper around Kernel.puts to allow for easy formatting
+      #
+      # #### Parameters
+      # * `text` - a string message to output
+      def puts(*args)
+        Kernel.puts(CLI::UI.fmt(*args))
+      end
+
+      # aborts the current running command and outputs an error message:
+      # - when the `help_message` is not provided, the error message appears in
+      #   a red frame, prefixed by an ✗ icon
+      # - when the `help_message` is provided, the error message appears in a
+      #   red frame, and the help message appears in a green frame
+      #
+      # #### Parameters
+      # * `error_message` - an error message to output
+      # * `help_message` - an optional help message
+      #
+      # #### Example
+      #
+      #   ShopifyCLI::Context.abort("Execution error")
+      #   # Output:
+      #   # ┏━━ Error ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+      #   # ┃ ✗ Execution error
+      #   # ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+      #
+      #   ShopifyCLI::Context.abort("Execution error", "export EXECUTION=1")
+      #   # Output:
+      #   # ┏━━ Error ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+      #   # ┃ Execution error
+      #   # ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+      #   # ┏━━ Try this ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+      #   # ┃ export EXECUTION=1
+      #   # ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
+      #
+      def abort(error_message, help_message = nil)
+        raise ShopifyCLI::Abort, "{{x}} #{error_message}" if help_message.nil?
+
+        frame(message("core.error"), color: :red) { self.puts(error_message) }
+        frame(message("core.try_this"), color: :green) { self.puts(help_message) }
+
+        raise ShopifyCLI::AbortSilent
+      end
+
+      private
+
+      def frame(title, color:, &block)
+        CLI::UI::Frame.open(title, color: CLI::UI.resolve_color(color), timing: false, &block)
+      end
     end
 
     # is the directory root that the current command is running in. If you want to
@@ -61,14 +111,19 @@ module ShopifyCLI
     # will return which operating system that the cli is running on [:mac, :linux]
     def os
       host = uname
-      return :mac_m1 if /arm64-apple-darwin/i.match(host)
+      return :mac_m1 if /arm64.*darwin/i.match(host)
       return :mac if /darwin/i.match(host)
       return :windows if /mswin|mingw|cygwin/i.match(host)
       return :linux if /linux|bsd/i.match(host)
       :unknown
     end
 
-    # will return true if the cli is running on an apple computer.
+    # will return true if the cli is running on an ARM Apple computer.
+    def mac_m1?
+      os == :mac_m1
+    end
+
+    # will return true if the cli is running on a Intel x86 Apple computer.
     def mac?
       os == :mac
     end
@@ -90,7 +145,7 @@ module ShopifyCLI
 
     # will return true if being launched from a tty
     def tty?
-      !testing? && $stdin.tty?
+      $stdin.tty?
     end
 
     # will return true if the cli is being run from an installation, and not a
@@ -329,7 +384,7 @@ module ShopifyCLI
           system("xdg-open", uri.to_s)
         elsif windows?
           system("start \"\" \"#{uri}\"")
-        elsif mac?
+        elsif mac? || mac_m1?
           system("open", uri.to_s)
         else
           open_url!(uri)
@@ -349,13 +404,13 @@ module ShopifyCLI
       puts "{{yellow:*}} #{text}"
     end
 
-    # a wrapper around Kernel.puts to allow for easy formatting
+    # proxy call to Context.puts.
     #
     # #### Parameters
     # * `text` - a string message to output
     #
     def puts(*args)
-      Kernel.puts(CLI::UI.fmt(*args))
+      Context.puts(*args)
     end
 
     # a wrapper around $stderr.puts to allow for easy formatting
@@ -385,14 +440,13 @@ module ShopifyCLI
       puts("{{v}} #{text}")
     end
 
-    # aborts the current running command and outputs an error message, prefixed
-    # by a red x
+    # proxy call to Context.abort.
     #
     # #### Parameters
-    # * `text` - a string message to output
-    #
-    def abort(text)
-      raise ShopifyCLI::Abort, "{{x}} #{text}"
+    # * `error_message` - an error message to output
+    # * `help_message` - an optional help message
+    def abort(error_message, help_message = nil)
+      Context.abort(error_message, help_message)
     end
 
     # outputs a message, prefixed by a red `DEBUG` tag. This will only output to

data/lib/shopify_cli/environment.rb

@@ -4,6 +4,21 @@ module ShopifyCLI
   module Environment
     TRUTHY_ENV_VARIABLE_VALUES = ["1", "true", "TRUE", "yes", "YES"]
 
+    def self.interactive=(interactive)
+      @interactive = interactive
+    end
+
+    def self.interactive?(env_variables: ENV)
+      if env_variables.key?(Constants::EnvironmentVariables::TTY)
+        env_variable_truthy?(
+          Constants::EnvironmentVariables::TTY,
+          env_variables: env_variables
+        )
+      else
+        @interactive ||= STDIN.tty?
+      end
+    end
+
     def self.development?(env_variables: ENV)
       env_variable_truthy?(
         Constants::EnvironmentVariables::DEVELOPMENT,
@@ -11,10 +26,6 @@ module ShopifyCLI
       )
     end
 
-    def self.interactive?
-      ShopifyCLI::Context.new.tty?
-    end
-
     def self.use_local_partners_instance?(env_variables: ENV)
       env_variable_truthy?(
         Constants::EnvironmentVariables::LOCAL_PARTNERS,

data/lib/shopify_cli/identity_auth.rb

@@ -229,6 +229,7 @@ module ShopifyCLI
       uri = URI.parse("#{auth_url}#{endpoint}")
       https = Net::HTTP.new(uri.host, uri.port)
       https.use_ssl = true
+      https.verify_mode = OpenSSL::SSL::VERIFY_NONE if ENV["SSL_VERIFY_NONE"]
       request = Net::HTTP::Post.new(uri.path)
       request["User-Agent"] = "Shopify CLI #{::ShopifyCLI::VERSION}"
       request.body = URI.encode_www_form(params)

data/lib/shopify_cli/messages/messages.rb

@@ -415,7 +415,7 @@ module ShopifyCLI
               Usage: {{command:%s login [--store=STORE]}}
           HELP
           invalid_shop: <<~MESSAGE,
-            Invalid store provided (%s). Please provide the store in the following format: my-store.myshopify.com
+            Invalid store provided (%s). Please make sure that the store belongs to your partner organization, and provide the store in the following format: my-store.myshopify.com
           MESSAGE
           shop_prompt: <<~PROMPT,
             What store are you connecting to? (e.g. my-store.myshopify.com; do {{bold:NOT}} include protocol part, e.g., https://)
@@ -790,6 +790,8 @@ module ShopifyCLI
           logged_in_partner_only: "Logged into partner organization {{green:%s}}",
           logged_in_partner_and_shop: "Logged into store {{green:%s}} in partner organization {{green:%s}}",
         },
+        error: "Error",
+        try_this: "Try this",
       },
     }.freeze
   end

data/lib/shopify_cli/resources/env_file.rb

@@ -14,6 +14,10 @@ module ShopifyCLI
       }
 
       class << self
+        def path(directory)
+          File.join(directory, FILENAME)
+        end
+
         def read(_directory = Dir.pwd, overrides: {})
           input = parse_external_env(overrides: overrides)
           new(input)
@@ -24,7 +28,7 @@ module ShopifyCLI
         end
 
         def parse(directory)
-          File.read(File.join(directory, FILENAME))
+          File.read(path(directory))
             .gsub("\r\n", "\n").split("\n").each_with_object({}) do |line, output|
             match = /\A([A-Za-z_0-9]+)\s*=\s*(.*)\z/.match(line)
             if match

data/lib/shopify_cli/theme/dev_server/hot-reload.js

@@ -15,9 +15,23 @@
     eventSource.onerror = () => eventSource.close();
   }
 
-  connect();
+  function reloadMode() {
+    var namespace = window.__SHOPIFY_CLI_ENV__;
+    return namespace.mode;
+  }
+
+  function isFullPageReloadMode(){
+    return reloadMode() === "full-page";
+  }
+
+  function isReloadModeActive(){
+    return reloadMode() !== "off";
+  }
 
   function isRefreshRequired(files) {
+    if (isFullPageReloadMode()) {
+      return true;
+    }
     return files.some((file) => !isCssFile(file) && !isSectionFile(file));
   }
 
@@ -119,4 +133,8 @@
       }
     }
   }
+
+  if (isReloadModeActive()) {
+    connect();
+  }
 })();

data/lib/shopify_cli/theme/dev_server/hot_reload.rb

@@ -4,10 +4,11 @@ module ShopifyCLI
   module Theme
     module DevServer
       class HotReload
-        def initialize(ctx, app, theme:, watcher:, ignore_filter: nil)
+        def initialize(ctx, app, theme:, watcher:, mode:, ignore_filter: nil)
           @ctx = ctx
           @app = app
           @theme = theme
+          @mode = mode
           @streams = SSE::Streams.new
           @watcher = watcher
           @watcher.add_observer(self, :notify_streams_of_file_change)
@@ -48,12 +49,27 @@ module ShopifyCLI
 
         def inject_hot_reload_javascript(body)
           hot_reload_js = ::File.read("#{__dir__}/hot-reload.js")
-          hot_reload_script = "<script>\n#{hot_reload_js}</script>"
+          hot_reload_script = [
+            "<script>",
+            params_js,
+            hot_reload_js,
+            "</script>",
+          ].join("\n")
+
           body = body.join.gsub("</body>", "#{hot_reload_script}\n</body>")
 
           [body]
         end
 
+        def params_js
+          env = { mode: @mode }
+          <<~JS
+            (() => {
+              window.__SHOPIFY_CLI_ENV__ = #{env.to_json};
+            })();
+          JS
+        end
+
         def create_stream
           stream = @streams.new
 

data/lib/shopify_cli/theme/dev_server/proxy.rb

@@ -18,6 +18,7 @@ module ShopifyCLI
         "trailer",
         "transfer-encoding",
         "upgrade",
+        "content-security-policy",
       ]
 
       class Proxy