refactor(common): properly configure PRECONNECT_CHECK_BLOCKLIST (#47082)

Refactoring tests made me realise that we are misinterpreting the
ensurePreconnect option - in fact it should configure the
PRECONNECT_CHECK_BLOCKLIST provider _only_ if the ensurePreconnect
is set to false.

PR Close #47082
This commit is contained in:
Pawel Kozlowski
2022-06-10 12:36:28 +02:00
committed by Pawel Kozlowski
parent 3b17d4c011
commit bd76ad6fa6
2 changed files with 39 additions and 97 deletions
@@ -54,7 +54,7 @@ export function createImageLoader(
const providers: Provider[] = [{provide: IMAGE_LOADER, useValue: urlFn(path)}];
if (ngDevMode && Boolean(options.ensurePreconnect) === true) {
if (ngDevMode && options.ensurePreconnect === false) {
providers.push({provide: PRECONNECT_CHECK_BLOCKLIST, useValue: [path], multi: true});
}
@@ -48,38 +48,6 @@ describe('Built-in image directive loaders', () => {
const config = {src: 'img.png', width: 100};
expect(loader(config)).toBe(`${path}/img.png?auto=format&w=100`);
});
describe('options', () => {
it('should configure PRECONNECT_CHECK_BLOCKLIST token by default', () => {
const path = 'https://somesite.imgix.net';
const providers = provideImgixLoader(path);
expect(providers.length).toBe(2);
const valueProvider = providers[1] as ValueProvider;
expect(valueProvider.multi).toBeTrue();
expect(valueProvider.useValue).toEqual([path]);
expect(valueProvider.provide).toBe(PRECONNECT_CHECK_BLOCKLIST);
});
it('should configure PRECONNECT_CHECK_BLOCKLIST when the ensurePreconnect was specified',
() => {
const path = 'https://somesite.imgix.net';
const providers = provideImgixLoader(path, {ensurePreconnect: true});
expect(providers.length).toBe(2);
const valueProvider = providers[1] as ValueProvider;
expect(valueProvider.multi).toBeTrue();
expect(valueProvider.useValue).toEqual([path]);
expect(valueProvider.provide).toBe(PRECONNECT_CHECK_BLOCKLIST);
});
it('should NOT configure PRECONNECT_CHECK_BLOCKLIST disabled with the ensurePreconnect option',
() => {
const providers =
provideImgixLoader('https://somesite.imgix.net', {ensurePreconnect: false});
expect(providers.length).toBe(1);
});
});
});
describe('Cloudinary loader', () => {
@@ -119,38 +87,6 @@ describe('Built-in image directive loaders', () => {
expect(loader({src: '/img.png'})).toBe(`${path}/image/upload/f_auto,q_auto/img.png`);
});
});
describe('options', () => {
it('should configure PRECONNECT_CHECK_BLOCKLIST token by default', () => {
const path = 'https://res.cloudinary.com/mysite';
const providers = provideCloudinaryLoader(path);
expect(providers.length).toBe(2);
const valueProvider = providers[1] as ValueProvider;
expect(valueProvider.multi).toBeTrue();
expect(valueProvider.useValue).toEqual([path]);
expect(valueProvider.provide).toBe(PRECONNECT_CHECK_BLOCKLIST);
});
it('should configure PRECONNECT_CHECK_BLOCKLIST when the ensurePreconnect was specified',
() => {
const path = 'https://res.cloudinary.com/mysite';
const providers = provideCloudinaryLoader(path, {ensurePreconnect: true});
expect(providers.length).toBe(2);
const valueProvider = providers[1] as ValueProvider;
expect(valueProvider.multi).toBeTrue();
expect(valueProvider.useValue).toEqual([path]);
expect(valueProvider.provide).toBe(PRECONNECT_CHECK_BLOCKLIST);
});
it('should NOT configure PRECONNECT_CHECK_BLOCKLIST disabled with the ensurePreconnect option',
() => {
const providers = provideCloudinaryLoader(
'https://res.cloudinary.com/mysite', {ensurePreconnect: false});
expect(providers.length).toBe(1);
});
});
});
describe('ImageKit loader', () => {
@@ -188,38 +124,6 @@ describe('Built-in image directive loaders', () => {
expect(loader({src: '/img.png'})).toBe(`${path}/tr:q-auto/img.png`);
});
});
describe('options', () => {
it('should configure PRECONNECT_CHECK_BLOCKLIST token by default', () => {
const path = 'https://ik.imageengine.io/imagetest';
const providers = provideImageKitLoader(path);
expect(providers.length).toBe(2);
const valueProvider = providers[1] as ValueProvider;
expect(valueProvider.multi).toBeTrue();
expect(valueProvider.useValue).toEqual([path]);
expect(valueProvider.provide).toBe(PRECONNECT_CHECK_BLOCKLIST);
});
it('should configure PRECONNECT_CHECK_BLOCKLIST when the ensurePreconnect was specified',
() => {
const path = 'https://ik.imageengine.io/imagetest';
const providers = provideImageKitLoader(path, {ensurePreconnect: true});
expect(providers.length).toBe(2);
const valueProvider = providers[1] as ValueProvider;
expect(valueProvider.multi).toBeTrue();
expect(valueProvider.useValue).toEqual([path]);
expect(valueProvider.provide).toBe(PRECONNECT_CHECK_BLOCKLIST);
});
it('should NOT configure PRECONNECT_CHECK_BLOCKLIST disabled with the ensurePreconnect option',
() => {
const providers = provideImageKitLoader(
'https://ik.imageengine.io/imagetest', {ensurePreconnect: false});
expect(providers.length).toBe(1);
});
});
});
describe('Cloudflare loader', () => {
@@ -239,6 +143,44 @@ describe('Built-in image directive loaders', () => {
});
});
describe('ensurePreconnect option', () => {
const path = 'https://some.host/base';
[provideImgixLoader,
provideCloudinaryLoader,
provideImageKitLoader,
provideCloudflareLoader,
].forEach(provideImageLoader => {
it(`${provideImageLoader.name} should _not_ block-list path by default`, () => {
const providers = provideImageLoader(path);
expect(providers.length).toBe(1);
const valueProvider = providers[0] as ValueProvider;
expect(valueProvider.provide).not.toBe(PRECONNECT_CHECK_BLOCKLIST);
});
it(`${provideImageLoader.name} should _not_ block-list path when ensurePreconnect is true`,
() => {
const providers = provideImageLoader(path, {ensurePreconnect: true});
expect(providers.length).toBe(1);
const valueProvider = providers[0] as ValueProvider;
expect(valueProvider.provide).not.toBe(PRECONNECT_CHECK_BLOCKLIST);
});
it('`${provideImageLoader.name} should block-list path when ensurePreconnect is false',
() => {
const providers = provideImageLoader(path, {ensurePreconnect: false});
expect(providers.length).toBe(2);
const valueProvider = providers[1] as ValueProvider;
expect(valueProvider.multi).toBeTrue();
expect(valueProvider.useValue).toEqual([path]);
expect(valueProvider.provide).toBe(PRECONNECT_CHECK_BLOCKLIST);
});
});
});
describe('loader utils', () => {
it('should identify valid paths', () => {
expect(isValidPath('https://cdn.imageprovider.com/image-test')).toBe(true);