Handle media.sources edge case in RemoteAsset

lib/theme_check/checks/remote_asset.rb

@@ -22,7 +22,6 @@ def on_element(node)
       return if resource_url =~ ABSOLUTE_PATH
       return if resource_url =~ RELATIVE_PATH
       return if url_hosted_by_shopify?(resource_url)
-      return if url_is_setting_variable?(resource_url)
 
       # Ignore non-stylesheet link tags
       rel = node.attributes["rel"]
@@ -37,12 +36,36 @@ def on_element(node)
     private
 
     def url_hosted_by_shopify?(url)
-      url.start_with?(Liquid::VariableStart) &&
-        AssetUrlFilters::ASSET_URL_FILTERS.any? { |filter| url.include?(filter) }
+      asset_url?(url) || looks_like_hosted_by_shopify?(url) || url_is_setting_variable?(url)
+    end
+
+    # There are some cases where it's kind of hard to tell if it's
+    # hosted by Shopify or not.
+    #
+    # e.g. {{ image }} is hosted on primary domain (not CDN)
+    #
+    # e.g. media.sources are on the CDN
+    # {% for source in media.sources %}
+    #   {{ source.url }}
+    # {% endfor %}
+    #
+    # So I'll go 80/20 here and assume that people name their variable
+    # source in `for source in media.sources`.
+    def looks_like_hosted_by_shopify?(url)
+      liquid_variable?(url) && url =~ /source\.url/
     end
 
     def url_is_setting_variable?(url)
-      url.start_with?(Liquid::VariableStart) && url =~ /settings\./
+      liquid_variable?(url) && url =~ /settings\./
+    end
+
+    def asset_url?(url)
+      liquid_variable?(url) &&
+        AssetUrlFilters::ASSET_URL_FILTERS.any? { |filter| url.include?(filter) }
+    end
+
+    def liquid_variable?(url)
+      url.start_with?(Liquid::VariableStart)
     end
   end
 end

test/checks/remote_asset_test.rb

@@ -28,6 +28,7 @@ def test_no_offense_for_good_behaviour
           <source src="{{ image.src | img_url }}">
           <source src="{{ image | img_url }}">
           <source src="{{ section.settings.video_url }}">
+          <source src="{{ source.url }}">
 
           <!-- weird edge cases from the wild -->
           <img alt="logo" src="" data-src="{{ url | asset_url | img_tag }}" width="100" height="100" />