Commit 60e8ad52 authored by Kunihiko Sakamoto's avatar Kunihiko Sakamoto Committed by Commit Bot

Rename srcset/imgsizes link attributes to imagesrcset/imagesizes

This patch renames "srcset" and "imgsizes" attributes on link
to "imagesrcset" and "imagesizes" respectively, to match the latest
spec PR [1].

Note: this feature is behind experimental-web-platform-features flag.

[1] https://github.com/whatwg/html/pull/4048

Bug: 813452
Change-Id: I8eabfbd734e2f29e36b7f7a3c4a32f1237b042b1
Reviewed-on: https://chromium-review.googlesource.com/c/1350414Reviewed-by: default avatarKouhei Ueno <kouhei@chromium.org>
Reviewed-by: default avatarKinuko Yasuda <kinuko@chromium.org>
Commit-Queue: Kunihiko Sakamoto <ksakamoto@chromium.org>
Cr-Commit-Position: refs/heads/master@{#610782}
parent 3f45509b
...@@ -98,7 +98,8 @@ ...@@ -98,7 +98,8 @@
"hspace", "hspace",
"http-equiv", "http-equiv",
"id", "id",
"imgsizes", "imagesizes",
"imagesrcset",
"importance", "importance",
"incremental", "incremental",
"inert", "inert",
......
...@@ -327,8 +327,8 @@ void LinkStyle::Process() { ...@@ -327,8 +327,8 @@ void LinkStyle::Process() {
owner_->nonce(), owner_->IntegrityValue(), owner_->nonce(), owner_->IntegrityValue(),
owner_->ImportanceValue().LowerASCII(), owner_->GetReferrerPolicy(), owner_->ImportanceValue().LowerASCII(), owner_->GetReferrerPolicy(),
owner_->GetNonEmptyURLAttribute(kHrefAttr), owner_->GetNonEmptyURLAttribute(kHrefAttr),
owner_->FastGetAttribute(kSrcsetAttr), owner_->FastGetAttribute(kImagesrcsetAttr),
owner_->FastGetAttribute(kImgsizesAttr)); owner_->FastGetAttribute(kImagesizesAttr));
WTF::TextEncoding charset = GetCharset(); WTF::TextEncoding charset = GetCharset();
......
...@@ -425,10 +425,10 @@ class TokenPreloadScanner::StartTagScanner { ...@@ -425,10 +425,10 @@ class TokenPreloadScanner::StartTagScanner {
integrity_attr_set_ = true; integrity_attr_set_ = true;
SubresourceIntegrity::ParseIntegrityAttribute( SubresourceIntegrity::ParseIntegrityAttribute(
attribute_value, integrity_features_, integrity_metadata_); attribute_value, integrity_features_, integrity_metadata_);
} else if (Match(attribute_name, kSrcsetAttr) && } else if (Match(attribute_name, kImagesrcsetAttr) &&
srcset_attribute_value_.IsNull()) { srcset_attribute_value_.IsNull()) {
srcset_attribute_value_ = attribute_value; srcset_attribute_value_ = attribute_value;
} else if (Match(attribute_name, kImgsizesAttr) && !source_size_set_) { } else if (Match(attribute_name, kImagesizesAttr) && !source_size_set_) {
ParseSourceSize(attribute_value); ParseSourceSize(attribute_value);
} else if (!importance_mode_set_ && } else if (!importance_mode_set_ &&
Match(attribute_name, kImportanceAttr) && Match(attribute_name, kImportanceAttr) &&
......
...@@ -101,8 +101,8 @@ LinkLoadParameters::LinkLoadParameters(const LinkHeader& header, ...@@ -101,8 +101,8 @@ LinkLoadParameters::LinkLoadParameters(const LinkHeader& header,
integrity(header.Integrity()), integrity(header.Integrity()),
referrer_policy(kReferrerPolicyDefault), referrer_policy(kReferrerPolicyDefault),
href(KURL(base_url, header.Url())), href(KURL(base_url, header.Url())),
srcset(header.Srcset()), image_srcset(header.ImageSrcset()),
sizes(header.Imgsizes()) {} image_sizes(header.ImageSizes()) {}
class LinkLoader::FinishObserver final class LinkLoader::FinishObserver final
: public GarbageCollectedFinalized<ResourceFinishObserver>, : public GarbageCollectedFinalized<ResourceFinishObserver>,
...@@ -362,14 +362,14 @@ static Resource* PreloadIfNeeded(const LinkLoadParameters& params, ...@@ -362,14 +362,14 @@ static Resource* PreloadIfNeeded(const LinkLoadParameters& params,
MediaValues* media_values = nullptr; MediaValues* media_values = nullptr;
KURL url; KURL url;
if (resource_type == ResourceType::kImage && !params.srcset.IsEmpty() && if (resource_type == ResourceType::kImage && !params.image_srcset.IsEmpty() &&
RuntimeEnabledFeatures::PreloadImageSrcSetEnabled()) { RuntimeEnabledFeatures::PreloadImageSrcSetEnabled()) {
media_values = CreateMediaValues(document, viewport_description); media_values = CreateMediaValues(document, viewport_description);
float source_size = float source_size =
SizesAttributeParser(media_values, params.sizes).length(); SizesAttributeParser(media_values, params.image_sizes).length();
ImageCandidate candidate = BestFitSourceForImageAttributes( ImageCandidate candidate = BestFitSourceForImageAttributes(
media_values->DevicePixelRatio(), source_size, params.href, media_values->DevicePixelRatio(), source_size, params.href,
params.srcset); params.image_srcset);
url = base_url.IsNull() ? document.CompleteURL(candidate.ToString()) url = base_url.IsNull() ? document.CompleteURL(candidate.ToString())
: KURL(base_url, candidate.ToString()); : KURL(base_url, candidate.ToString());
} else { } else {
......
...@@ -65,8 +65,8 @@ struct LinkLoadParameters { ...@@ -65,8 +65,8 @@ struct LinkLoadParameters {
const String& importance, const String& importance,
const ReferrerPolicy& referrer_policy, const ReferrerPolicy& referrer_policy,
const KURL& href, const KURL& href,
const String& srcset, const String& image_srcset,
const String& sizes) const String& image_sizes)
: rel(rel), : rel(rel),
cross_origin(cross_origin), cross_origin(cross_origin),
type(type), type(type),
...@@ -77,8 +77,8 @@ struct LinkLoadParameters { ...@@ -77,8 +77,8 @@ struct LinkLoadParameters {
importance(importance), importance(importance),
referrer_policy(referrer_policy), referrer_policy(referrer_policy),
href(href), href(href),
srcset(srcset), image_srcset(image_srcset),
sizes(sizes) {} image_sizes(image_sizes) {}
LinkLoadParameters(const LinkHeader&, const KURL& base_url); LinkLoadParameters(const LinkHeader&, const KURL& base_url);
LinkRelAttribute rel; LinkRelAttribute rel;
...@@ -91,8 +91,8 @@ struct LinkLoadParameters { ...@@ -91,8 +91,8 @@ struct LinkLoadParameters {
String importance; String importance;
ReferrerPolicy referrer_policy; ReferrerPolicy referrer_policy;
KURL href; KURL href;
String srcset; String image_srcset;
String sizes; String image_sizes;
}; };
// The LinkLoader can load link rel types icon, dns-prefetch, prefetch, and // The LinkLoader can load link rel types icon, dns-prefetch, prefetch, and
......
...@@ -379,15 +379,15 @@ INSTANTIATE_TEST_CASE_P(LinkLoaderPreloadNonceTest, ...@@ -379,15 +379,15 @@ INSTANTIATE_TEST_CASE_P(LinkLoaderPreloadNonceTest,
LinkLoaderPreloadNonceTest, LinkLoaderPreloadNonceTest,
testing::ValuesIn(kPreloadNonceTestParams)); testing::ValuesIn(kPreloadNonceTestParams));
struct PreloadSrcsetTestParams { struct PreloadImageSrcsetTestParams {
const char* href; const char* href;
const char* srcset; const char* image_srcset;
const char* sizes; const char* image_sizes;
float scale_factor; float scale_factor;
const char* expected_url; const char* expected_url;
}; };
constexpr PreloadSrcsetTestParams kPreloadSrcsetTestParams[] = { constexpr PreloadImageSrcsetTestParams kPreloadImageSrcsetTestParams[] = {
{"http://example.test/cat.gif", {"http://example.test/cat.gif",
"http://example.test/cat1x.gif 1x, http://example.test/cat2x.gif 2x", "http://example.test/cat1x.gif 1x, http://example.test/cat2x.gif 2x",
nullptr, 1.0, "http://example.test/cat1x.gif"}, nullptr, 1.0, "http://example.test/cat1x.gif"},
...@@ -405,11 +405,11 @@ constexpr PreloadSrcsetTestParams kPreloadSrcsetTestParams[] = { ...@@ -405,11 +405,11 @@ constexpr PreloadSrcsetTestParams kPreloadSrcsetTestParams[] = {
"http://example.test/cat200.gif"}, "http://example.test/cat200.gif"},
}; };
class LinkLoaderPreloadSrcsetTest class LinkLoaderPreloadImageSrcsetTest
: public LinkLoaderPreloadTestBase, : public LinkLoaderPreloadTestBase,
public testing::WithParamInterface<PreloadSrcsetTestParams> {}; public testing::WithParamInterface<PreloadImageSrcsetTestParams> {};
TEST_P(LinkLoaderPreloadSrcsetTest, Preload) { TEST_P(LinkLoaderPreloadImageSrcsetTest, Preload) {
const auto& test_case = GetParam(); const auto& test_case = GetParam();
dummy_page_holder_->GetDocument().SetBaseURLOverride( dummy_page_holder_->GetDocument().SetBaseURLOverride(
KURL("http://example.test/")); KURL("http://example.test/"));
...@@ -418,16 +418,17 @@ TEST_P(LinkLoaderPreloadSrcsetTest, Preload) { ...@@ -418,16 +418,17 @@ TEST_P(LinkLoaderPreloadSrcsetTest, Preload) {
LinkLoadParameters params( LinkLoadParameters params(
LinkRelAttribute("preload"), kCrossOriginAttributeNotSet, "image/gif", LinkRelAttribute("preload"), kCrossOriginAttributeNotSet, "image/gif",
"image", String(), String(), String(), String(), kReferrerPolicyDefault, "image", String(), String(), String(), String(), kReferrerPolicyDefault,
KURL(NullURL(), test_case.href), test_case.srcset, test_case.sizes); KURL(NullURL(), test_case.href), test_case.image_srcset,
test_case.image_sizes);
Expectations expectations = { Expectations expectations = {
ResourceLoadPriority::kLow, mojom::RequestContextType::IMAGE, true, ResourceLoadPriority::kLow, mojom::RequestContextType::IMAGE, true,
KURL(NullURL(), test_case.expected_url), kReferrerPolicyDefault}; KURL(NullURL(), test_case.expected_url), kReferrerPolicyDefault};
TestPreload(params, expectations); TestPreload(params, expectations);
} }
INSTANTIATE_TEST_CASE_P(LinkLoaderPreloadSrcsetTest, INSTANTIATE_TEST_CASE_P(LinkLoaderPreloadImageSrcsetTest,
LinkLoaderPreloadSrcsetTest, LinkLoaderPreloadImageSrcsetTest,
testing::ValuesIn(kPreloadSrcsetTestParams)); testing::ValuesIn(kPreloadImageSrcsetTestParams));
struct ModulePreloadTestParams { struct ModulePreloadTestParams {
const char* href; const char* href;
...@@ -507,7 +508,7 @@ TEST_P(LinkLoaderModulePreloadTest, ModulePreload) { ...@@ -507,7 +508,7 @@ TEST_P(LinkLoaderModulePreloadTest, ModulePreload) {
LinkRelAttribute("modulepreload"), test_case.cross_origin, LinkRelAttribute("modulepreload"), test_case.cross_origin,
String() /* type */, String() /* as */, String() /* media */, String() /* type */, String() /* as */, String() /* media */,
test_case.nonce, test_case.integrity, String(), test_case.referrer_policy, test_case.nonce, test_case.integrity, String(), test_case.referrer_policy,
href_url, String() /* srcset */, String() /* sizes */); href_url, String() /* image_srcset */, String() /* image_sizes */);
loader->LoadLink(params, dummy_page_holder->GetDocument(), loader->LoadLink(params, dummy_page_holder->GetDocument(),
NetworkHintsMock()); NetworkHintsMock());
ASSERT_EQ(test_case.expecting_load, modulator->fetched()); ASSERT_EQ(test_case.expecting_load, modulator->fetched());
...@@ -548,11 +549,11 @@ TEST(LinkLoaderTest, Prefetch) { ...@@ -548,11 +549,11 @@ TEST(LinkLoaderTest, Prefetch) {
LinkLoader* loader = LinkLoader::Create(loader_client.Get()); LinkLoader* loader = LinkLoader::Create(loader_client.Get());
KURL href_url = KURL(NullURL(), test_case.href); KURL href_url = KURL(NullURL(), test_case.href);
url_test_helpers::RegisterMockedErrorURLLoad(href_url); url_test_helpers::RegisterMockedErrorURLLoad(href_url);
LinkLoadParameters params(LinkRelAttribute("prefetch"), LinkLoadParameters params(
kCrossOriginAttributeNotSet, test_case.type, "", LinkRelAttribute("prefetch"), kCrossOriginAttributeNotSet,
test_case.media, "", "", String(), test_case.type, "", test_case.media, "", "", String(),
test_case.referrer_policy, href_url, test_case.referrer_policy, href_url, String() /* image_srcset */,
String() /* srcset */, String() /* sizes */); String() /* image_sizes */);
loader->LoadLink(params, dummy_page_holder->GetDocument(), loader->LoadLink(params, dummy_page_holder->GetDocument(),
NetworkHintsMock()); NetworkHintsMock());
ASSERT_TRUE(dummy_page_holder->GetDocument().Fetcher()); ASSERT_TRUE(dummy_page_holder->GetDocument().Fetcher());
...@@ -596,11 +597,11 @@ TEST(LinkLoaderTest, DNSPrefetch) { ...@@ -596,11 +597,11 @@ TEST(LinkLoaderTest, DNSPrefetch) {
LinkLoader* loader = LinkLoader::Create(loader_client.Get()); LinkLoader* loader = LinkLoader::Create(loader_client.Get());
KURL href_url = KURL(KURL(String("http://example.com")), test_case.href); KURL href_url = KURL(KURL(String("http://example.com")), test_case.href);
NetworkHintsMock network_hints; NetworkHintsMock network_hints;
LinkLoadParameters params(LinkRelAttribute("dns-prefetch"), LinkLoadParameters params(
kCrossOriginAttributeNotSet, String(), String(), LinkRelAttribute("dns-prefetch"), kCrossOriginAttributeNotSet, String(),
String(), String(), String(), String(), String(), String(), String(), String(), String(),
kReferrerPolicyDefault, href_url, kReferrerPolicyDefault, href_url, String() /* image_srcset */,
String() /* srcset */, String() /* sizes */); String() /* image_sizes */);
loader->LoadLink(params, dummy_page_holder->GetDocument(), network_hints); loader->LoadLink(params, dummy_page_holder->GetDocument(), network_hints);
EXPECT_FALSE(network_hints.DidPreconnect()); EXPECT_FALSE(network_hints.DidPreconnect());
EXPECT_EQ(test_case.should_load, network_hints.DidDnsPrefetch()); EXPECT_EQ(test_case.should_load, network_hints.DidDnsPrefetch());
...@@ -632,11 +633,11 @@ TEST(LinkLoaderTest, Preconnect) { ...@@ -632,11 +633,11 @@ TEST(LinkLoaderTest, Preconnect) {
LinkLoader* loader = LinkLoader::Create(loader_client.Get()); LinkLoader* loader = LinkLoader::Create(loader_client.Get());
KURL href_url = KURL(KURL(String("http://example.com")), test_case.href); KURL href_url = KURL(KURL(String("http://example.com")), test_case.href);
NetworkHintsMock network_hints; NetworkHintsMock network_hints;
LinkLoadParameters params(LinkRelAttribute("preconnect"), LinkLoadParameters params(
test_case.cross_origin, String(), String(), LinkRelAttribute("preconnect"), test_case.cross_origin, String(),
String(), String(), String(), String(), String(), String(), String(), String(), String(),
kReferrerPolicyDefault, href_url, kReferrerPolicyDefault, href_url, String() /* image_srcset */,
String() /* srcset */, String() /* sizes */); String() /* image_sizes */);
loader->LoadLink(params, dummy_page_holder->GetDocument(), network_hints); loader->LoadLink(params, dummy_page_holder->GetDocument(), network_hints);
EXPECT_EQ(test_case.should_load, network_hints.DidPreconnect()); EXPECT_EQ(test_case.should_load, network_hints.DidPreconnect());
EXPECT_EQ(test_case.is_https, network_hints.IsHTTPS()); EXPECT_EQ(test_case.is_https, network_hints.IsHTTPS());
...@@ -655,11 +656,11 @@ TEST(LinkLoaderTest, PreloadAndPrefetch) { ...@@ -655,11 +656,11 @@ TEST(LinkLoaderTest, PreloadAndPrefetch) {
LinkLoader* loader = LinkLoader::Create(loader_client.Get()); LinkLoader* loader = LinkLoader::Create(loader_client.Get());
KURL href_url = KURL(KURL(), "https://www.example.com/"); KURL href_url = KURL(KURL(), "https://www.example.com/");
url_test_helpers::RegisterMockedErrorURLLoad(href_url); url_test_helpers::RegisterMockedErrorURLLoad(href_url);
LinkLoadParameters params(LinkRelAttribute("preload prefetch"), LinkLoadParameters params(
kCrossOriginAttributeNotSet, LinkRelAttribute("preload prefetch"), kCrossOriginAttributeNotSet,
"application/javascript", "script", "", "", "", "application/javascript", "script", "", "", "", String(),
String(), kReferrerPolicyDefault, href_url, kReferrerPolicyDefault, href_url, String() /* image_srcset */,
String() /* srcset */, String() /* sizes */); String() /* image_sizes */);
loader->LoadLink(params, dummy_page_holder->GetDocument(), loader->LoadLink(params, dummy_page_holder->GetDocument(),
NetworkHintsMock()); NetworkHintsMock());
ASSERT_EQ(1, fetcher->CountPreloads()); ASSERT_EQ(1, fetcher->CountPreloads());
......
...@@ -40,10 +40,10 @@ static LinkHeader::LinkParameterName ParameterNameFromString( ...@@ -40,10 +40,10 @@ static LinkHeader::LinkParameterName ParameterNameFromString(
return LinkHeader::kLinkParameterNonce; return LinkHeader::kLinkParameterNonce;
if (base::EqualsCaseInsensitiveASCII(name, "integrity")) if (base::EqualsCaseInsensitiveASCII(name, "integrity"))
return LinkHeader::kLinkParameterIntegrity; return LinkHeader::kLinkParameterIntegrity;
if (base::EqualsCaseInsensitiveASCII(name, "srcset")) if (base::EqualsCaseInsensitiveASCII(name, "imagesrcset"))
return LinkHeader::kLinkParameterSrcset; return LinkHeader::kLinkParameterImageSrcset;
if (base::EqualsCaseInsensitiveASCII(name, "imgsizes")) if (base::EqualsCaseInsensitiveASCII(name, "imagesizes"))
return LinkHeader::kLinkParameterImgsizes; return LinkHeader::kLinkParameterImageSizes;
return LinkHeader::kLinkParameterUnknown; return LinkHeader::kLinkParameterUnknown;
} }
...@@ -64,10 +64,10 @@ void LinkHeader::SetValue(LinkParameterName name, const String& value) { ...@@ -64,10 +64,10 @@ void LinkHeader::SetValue(LinkParameterName name, const String& value) {
nonce_ = value; nonce_ = value;
else if (name == kLinkParameterIntegrity) else if (name == kLinkParameterIntegrity)
integrity_ = value; integrity_ = value;
else if (name == kLinkParameterSrcset) else if (name == kLinkParameterImageSrcset)
srcset_ = value; image_srcset_ = value;
else if (name == kLinkParameterImgsizes) else if (name == kLinkParameterImageSizes)
imgsizes_ = value; image_sizes_ = value;
} }
template <typename Iterator> template <typename Iterator>
......
...@@ -23,8 +23,8 @@ class LinkHeader { ...@@ -23,8 +23,8 @@ class LinkHeader {
const String& CrossOrigin() const { return cross_origin_; } const String& CrossOrigin() const { return cross_origin_; }
const String& Nonce() const { return nonce_; } const String& Nonce() const { return nonce_; }
const String& Integrity() const { return integrity_; } const String& Integrity() const { return integrity_; }
const String& Srcset() const { return srcset_; } const String& ImageSrcset() const { return image_srcset_; }
const String& Imgsizes() const { return imgsizes_; } const String& ImageSizes() const { return image_sizes_; }
bool Valid() const { return is_valid_; } bool Valid() const { return is_valid_; }
enum LinkParameterName { enum LinkParameterName {
...@@ -41,8 +41,8 @@ class LinkHeader { ...@@ -41,8 +41,8 @@ class LinkHeader {
kLinkParameterAs, kLinkParameterAs,
kLinkParameterNonce, kLinkParameterNonce,
kLinkParameterIntegrity, kLinkParameterIntegrity,
kLinkParameterSrcset, kLinkParameterImageSrcset,
kLinkParameterImgsizes, kLinkParameterImageSizes,
}; };
private: private:
...@@ -60,8 +60,8 @@ class LinkHeader { ...@@ -60,8 +60,8 @@ class LinkHeader {
String cross_origin_; String cross_origin_;
String nonce_; String nonce_;
String integrity_; String integrity_;
String srcset_; String image_srcset_;
String imgsizes_; String image_sizes_;
bool is_valid_; bool is_valid_;
}; };
......
...@@ -4,7 +4,7 @@ ...@@ -4,7 +4,7 @@
<script src="/resources/testharnessreport.js"></script> <script src="/resources/testharnessreport.js"></script>
<script src="/preload/resources/preload_helper.js"></script> <script src="/preload/resources/preload_helper.js"></script>
<script> <script>
var t = async_test('Makes sure that Link headers preload images with (experimental) srcset/imgsizes attributes.'); var t = async_test('Makes sure that Link headers preload images with (experimental) imagesrcset/imagesizes attributes.');
</script> </script>
<body> <body>
<script src="resources/dummy.js?pipe=trickle(d3)&link-header-preload-srcset"></script> <script src="resources/dummy.js?pipe=trickle(d3)&link-header-preload-srcset"></script>
......
Link: <resources/square.png?1x>; rel=preload; as=image; srcset="resources/square.png?2x 2x, resources/square.png?3x 3x" Link: <resources/square.png?1x>; rel=preload; as=image; imagesrcset="resources/square.png?2x 2x, resources/square.png?3x 3x"
Link: <resources/square.png?base>; rel=preload; as=image; srcset="resources/square.png?200 200w, resources/square.png?400 400w, resources/square.png?800 800w"; imgsizes=400px Link: <resources/square.png?base>; rel=preload; as=image; imagesrcset="resources/square.png?200 200w, resources/square.png?400 400w, resources/square.png?800 800w"; imagesizes=400px
Link: <resources/square.png?base>; rel=preload; as=image; srcset="resources/square.png?150 150w, resources/square.png?300 300w, resources/square.png?600 600w"; imgsizes="(min-width: 300px) 300px, 150px" Link: <resources/square.png?base>; rel=preload; as=image; imagesrcset="resources/square.png?150 150w, resources/square.png?300 300w, resources/square.png?600 600w"; imagesizes="(min-width: 300px) 300px, 150px"
...@@ -33,23 +33,23 @@ ...@@ -33,23 +33,23 @@
</script> </script>
<!-- Control group --> <!-- Control group -->
<link rel="preload" as="image" href="resources/image2.png"> <link rel="preload" as="image" href="resources/image2.png">
<!-- All permutations of href, srcset and sizes --> <!-- All permutations of href, imagesrcset and imagesizes -->
<link rel="preload" as="image" href="resources/preload-test.jpg?1" imgsizes="400px" srcset="resources/base-image1.png?1 200w, resources/base-image3.png?1 400w, resources/base-image2.png?1 800w"> <link rel="preload" as="image" href="resources/preload-test.jpg?1" imagesizes="400px" imagesrcset="resources/base-image1.png?1 200w, resources/base-image3.png?1 400w, resources/base-image2.png?1 800w">
<link rel="preload" as="image" href="resources/preload-test.jpg?2" srcset="resources/base-image1.png?2 200w, resources/base-image3.png?2 400w, resources/base-image2.png?2 800w" imgsizes="400px"> <link rel="preload" as="image" href="resources/preload-test.jpg?2" imagesrcset="resources/base-image1.png?2 200w, resources/base-image3.png?2 400w, resources/base-image2.png?2 800w" imagesizes="400px">
<link rel="preload" as="image" imgsizes="400px" href="resources/preload-test.jpg?3" srcset="resources/base-image1.png?3 200w, resources/base-image3.png?3 400w, resources/base-image2.png?3 800w"> <link rel="preload" as="image" imagesizes="400px" href="resources/preload-test.jpg?3" imagesrcset="resources/base-image1.png?3 200w, resources/base-image3.png?3 400w, resources/base-image2.png?3 800w">
<link rel="preload" as="image" imgsizes="400px" srcset="resources/base-image1.png?4 200w, resources/base-image3.png?4 400w, resources/base-image2.png?4 800w" href="resources/preload-test.jpg?4"> <link rel="preload" as="image" imagesizes="400px" imagesrcset="resources/base-image1.png?4 200w, resources/base-image3.png?4 400w, resources/base-image2.png?4 800w" href="resources/preload-test.jpg?4">
<link rel="preload" as="image" srcset="resources/base-image1.png?5 200w, resources/base-image3.png?5 400w, resources/base-image2.png?5 800w" href="resources/preload-test.jpg?5" imgsizes="400px"> <link rel="preload" as="image" imagesrcset="resources/base-image1.png?5 200w, resources/base-image3.png?5 400w, resources/base-image2.png?5 800w" href="resources/preload-test.jpg?5" imagesizes="400px">
<link rel="preload" as="image" srcset="resources/base-image1.png?6 200w, resources/base-image3.png?6 400w, resources/base-image2.png?6 800w" imgsizes="400px" href="resources/preload-test.jpg?6"> <link rel="preload" as="image" imagesrcset="resources/base-image1.png?6 200w, resources/base-image3.png?6 400w, resources/base-image2.png?6 800w" imagesizes="400px" href="resources/preload-test.jpg?6">
<!-- Duplicate attributes --> <!-- Duplicate attributes -->
<link rel="preload" as="image" srcset="resources/base-image1.png?7 200w, resources/base-image3.png?7 400w, resources/base-image2.png?7 800w" imgsizes="400px" href="resources/preload-test.jpg?7" <link rel="preload" as="image" imagesrcset="resources/base-image1.png?7 200w, resources/base-image3.png?7 400w, resources/base-image2.png?7 800w" imagesizes="400px" href="resources/preload-test.jpg?7"
href="resources/dup-image1.png?7"> href="resources/dup-image1.png?7">
<link rel="preload" as="image" srcset="resources/base-image1.png?8 200w, resources/base-image3.png?8 400w, resources/base-image2.png?8 800w" imgsizes="400px" href="resources/preload-test.jpg?8" <link rel="preload" as="image" imagesrcset="resources/base-image1.png?8 200w, resources/base-image3.png?8 400w, resources/base-image2.png?8 800w" imagesizes="400px" href="resources/preload-test.jpg?8"
srcset="resources/dup-image1.png?8 200w, resources/dup-image3.png?8 400w, resources/dup-image2.png?8 800w"> imagesrcset="resources/dup-image1.png?8 200w, resources/dup-image3.png?8 400w, resources/dup-image2.png?8 800w">
<link rel="preload" as="image" srcset="resources/base-image1.png?9 200w, resources/base-image3.png?9 400w, resources/base-image2.png?9 800w" imgsizes="400px" href="resources/preload-test.jpg?9" <link rel="preload" as="image" imagesrcset="resources/base-image1.png?9 200w, resources/base-image3.png?9 400w, resources/base-image2.png?9 800w" imagesizes="400px" href="resources/preload-test.jpg?9"
imgsizes="800px"> imagesizes="800px">
<!-- Sizes with 'x' descriptors --> <!-- Sizes with 'x' descriptors -->
<link rel="preload" as="image" srcset="resources/base-image1.png?10 2x, resources/base-image3.png?10 4x, resources/base-image2.png?10 8x" imgsizes="400px" href="resources/preload-test.jpg?10"> <link rel="preload" as="image" imagesrcset="resources/base-image1.png?10 2x, resources/base-image3.png?10 4x, resources/base-image2.png?10 8x" imagesizes="400px" href="resources/preload-test.jpg?10">
<!-- fractional sizes --> <!-- fractional sizes -->
<link rel="preload" as="image" srcset="resources/base-image1.png?11 1w, resources/base-image2.png?11 2w" imgsizes="0.9px" href="resources/preload-test.jpg?11"> <link rel="preload" as="image" imagesrcset="resources/base-image1.png?11 1w, resources/base-image2.png?11 2w" imagesizes="0.9px" href="resources/preload-test.jpg?11">
</body> </body>
</html> </html>
...@@ -26,21 +26,21 @@ ...@@ -26,21 +26,21 @@
</script> </script>
<!-- Control group --> <!-- Control group -->
<link rel="preload" as="image" href="resources/image2.png"> <link rel="preload" as="image" href="resources/image2.png">
<!-- All permutations of href, srcset and sizes --> <!-- All permutations of href, imagesrcset and imagesizes -->
<link rel="preload" as="image" href="resources/preload-test.jpg?1" imgsizes="400px" srcset="resources/base-image1.png?1 200w, resources/base-image3.png?1 400w, resources/base-image2.png?1 800w"> <link rel="preload" as="image" href="resources/preload-test.jpg?1" imagesizes="400px" imagesrcset="resources/base-image1.png?1 200w, resources/base-image3.png?1 400w, resources/base-image2.png?1 800w">
<link rel="preload" as="image" href="resources/preload-test.jpg?2" srcset="resources/base-image1.png?2 200w, resources/base-image3.png?2 400w, resources/base-image2.png?2 800w" imgsizes="400px"> <link rel="preload" as="image" href="resources/preload-test.jpg?2" imagesrcset="resources/base-image1.png?2 200w, resources/base-image3.png?2 400w, resources/base-image2.png?2 800w" imagesizes="400px">
<link rel="preload" as="image" imgsizes="400px" href="resources/preload-test.jpg?3" srcset="resources/base-image1.png?3 200w, resources/base-image3.png?3 400w, resources/base-image2.png?3 800w"> <link rel="preload" as="image" imagesizes="400px" href="resources/preload-test.jpg?3" imagesrcset="resources/base-image1.png?3 200w, resources/base-image3.png?3 400w, resources/base-image2.png?3 800w">
<link rel="preload" as="image" imgsizes="400px" srcset="resources/base-image1.png?4 200w, resources/base-image3.png?4 400w, resources/base-image2.png?4 800w" href="resources/preload-test.jpg?4"> <link rel="preload" as="image" imagesizes="400px" imagesrcset="resources/base-image1.png?4 200w, resources/base-image3.png?4 400w, resources/base-image2.png?4 800w" href="resources/preload-test.jpg?4">
<link rel="preload" as="image" srcset="resources/base-image1.png?5 200w, resources/base-image3.png?5 400w, resources/base-image2.png?5 800w" href="resources/preload-test.jpg?5" imgsizes="400px"> <link rel="preload" as="image" imagesrcset="resources/base-image1.png?5 200w, resources/base-image3.png?5 400w, resources/base-image2.png?5 800w" href="resources/preload-test.jpg?5" imagesizes="400px">
<link rel="preload" as="image" srcset="resources/base-image1.png?6 200w, resources/base-image3.png?6 400w, resources/base-image2.png?6 800w" imgsizes="400px" href="resources/preload-test.jpg?6"> <link rel="preload" as="image" imagesrcset="resources/base-image1.png?6 200w, resources/base-image3.png?6 400w, resources/base-image2.png?6 800w" imagesizes="400px" href="resources/preload-test.jpg?6">
<!-- Duplicate attributes --> <!-- Duplicate attributes -->
<link rel="preload" as="image" srcset="resources/base-image1.png?7 200w, resources/base-image3.png?7 400w, resources/base-image2.png?7 800w" imgsizes="400px" href="resources/preload-test.jpg?7" <link rel="preload" as="image" imagesrcset="resources/base-image1.png?7 200w, resources/base-image3.png?7 400w, resources/base-image2.png?7 800w" imagesizes="400px" href="resources/preload-test.jpg?7"
href="resources/dup-image1.png?7"> href="resources/dup-image1.png?7">
<link rel="preload" as="image" srcset="resources/base-image1.png?8 200w, resources/base-image3.png?8 400w, resources/base-image2.png?8 800w" imgsizes="400px" href="resources/preload-test.jpg?8" <link rel="preload" as="image" imagesrcset="resources/base-image1.png?8 200w, resources/base-image3.png?8 400w, resources/base-image2.png?8 800w" imagesizes="400px" href="resources/preload-test.jpg?8"
srcset="resources/dup-image1.png?8 200w, resources/dup-image3.png?8 400w, resources/dup-image2.png?8 800w"> imagesrcset="resources/dup-image1.png?8 200w, resources/dup-image3.png?8 400w, resources/dup-image2.png?8 800w">
<link rel="preload" as="image" srcset="resources/base-image1.png?9 200w, resources/base-image3.png?9 400w, resources/base-image2.png?9 800w" imgsizes="400px" href="resources/preload-test.jpg?9" <link rel="preload" as="image" imagesrcset="resources/base-image1.png?9 200w, resources/base-image3.png?9 400w, resources/base-image2.png?9 800w" imagesizes="400px" href="resources/preload-test.jpg?9"
imgsizes="800px"> imagesizes="800px">
<!-- Sizes with 'x' descriptors --> <!-- Sizes with 'x' descriptors -->
<link rel="preload" as="image" srcset="resources/base-image1.png?10 2x, resources/base-image3.png?10 4x, resources/base-image2.png?10 8x" imgsizes="400px" href="resources/preload-test.jpg?10"> <link rel="preload" as="image" imagesrcset="resources/base-image1.png?10 2x, resources/base-image3.png?10 4x, resources/base-image2.png?10 8x" imagesizes="400px" href="resources/preload-test.jpg?10">
</body> </body>
</html> </html>
...@@ -18,5 +18,5 @@ PASS internals.isPreloaded('resources/image2.png'); is true ...@@ -18,5 +18,5 @@ PASS internals.isPreloaded('resources/image2.png'); is true
PASS successfullyParsed is true PASS successfullyParsed is true
TEST COMPLETE TEST COMPLETE
This test passes if the fallback image (defined in the href attribute) is not preloaded, but the 2x version (defined in srcset) is. This test passes if the fallback image (defined in the href attribute) is not preloaded, but the 2x version (defined in imagesrcset) is.
The second link rel=preload is here to make sure isPreloaded is working properly The second link rel=preload is here to make sure isPreloaded is working properly
...@@ -15,9 +15,9 @@ ...@@ -15,9 +15,9 @@
shouldBeFalse("internals.isPreloaded('resources/base-image3.png');"); shouldBeFalse("internals.isPreloaded('resources/base-image3.png');");
shouldBeTrue("internals.isPreloaded('resources/image2.png');"); shouldBeTrue("internals.isPreloaded('resources/image2.png');");
</script> </script>
<div>This test passes if the fallback image (defined in the href attribute) is not preloaded, but the 2x version (defined in srcset) is.</div> <div>This test passes if the fallback image (defined in the href attribute) is not preloaded, but the 2x version (defined in imagesrcset) is.</div>
<div>The second link rel=preload is here to make sure isPreloaded is working properly</div> <div>The second link rel=preload is here to make sure isPreloaded is working properly</div>
<link rel="preload" as="image" href="resources/preload-test.jpg" srcset="resources/base-image1.png 1x, resources/base-image3.png 3x, resources/base-image2.png 2x"> <link rel="preload" as="image" href="resources/preload-test.jpg" imagesrcset="resources/base-image1.png 1x, resources/base-image3.png 3x, resources/base-image2.png 2x">
<link rel="preload" as="image" href="resources/image2.png"> <link rel="preload" as="image" href="resources/image2.png">
</body> </body>
</html> </html>
......
...@@ -18,5 +18,5 @@ PASS internals.isPreloaded('resources/image2.png'); is true ...@@ -18,5 +18,5 @@ PASS internals.isPreloaded('resources/image2.png'); is true
PASS successfullyParsed is true PASS successfullyParsed is true
TEST COMPLETE TEST COMPLETE
This test passes if the fallback image (defined in the href attribute) is not preloaded, but the 1x version (defined in srcset) is. This test passes if the fallback image (defined in the href attribute) is not preloaded, but the 1x version (defined in imagesrcset) is.
The second link rel=preload is here to make sure isPreloaded is working properly The second link rel=preload is here to make sure isPreloaded is working properly
...@@ -15,9 +15,9 @@ ...@@ -15,9 +15,9 @@
shouldBeFalse("internals.isPreloaded('resources/base-image3.png');"); shouldBeFalse("internals.isPreloaded('resources/base-image3.png');");
shouldBeTrue("internals.isPreloaded('resources/image2.png');"); shouldBeTrue("internals.isPreloaded('resources/image2.png');");
</script> </script>
<div>This test passes if the fallback image (defined in the href attribute) is not preloaded, but the 1x version (defined in srcset) is.</div> <div>This test passes if the fallback image (defined in the href attribute) is not preloaded, but the 1x version (defined in imagesrcset) is.</div>
<div>The second link rel=preload is here to make sure isPreloaded is working properly</div> <div>The second link rel=preload is here to make sure isPreloaded is working properly</div>
<link rel="preload" as="image" href="resources/preload-test.jpg" srcset="resources/base-image1.png 1x, resources/base-image3.png 3x, resources/base-image2.png 2x"> <link rel="preload" as="image" href="resources/preload-test.jpg" imagesrcset="resources/base-image1.png 1x, resources/base-image3.png 3x, resources/base-image2.png 2x">
<link rel="preload" as="image" href="resources/image2.png"> <link rel="preload" as="image" href="resources/image2.png">
</body> </body>
</html> </html>
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment