mirror of
https://github.com/strapi/strapi.git
synced 2025-09-09 08:39:45 +00:00
Fix snapshot
This commit is contained in:
mfrachet
parent
331e952721
commit
18e7477efd
@ -0,0 +1,414 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { ThemeProvider, lightTheme } from '@strapi/parts';
|
||||||
|
import { render as renderTL } from '@testing-library/react';
|
||||||
|
import { ImageAssetCard } from '../ImageAssetCard';
|
||||||
|
import en from '../../../translations/en.json';
|
||||||
|
|
||||||
|
jest.mock('../../../utils', () => ({
|
||||||
|
...jest.requireActual('../../../utils'),
|
||||||
|
getTrad: x => x,
|
||||||
|
}));
|
||||||
|
|
||||||
|
jest.mock('react-intl', () => ({
|
||||||
|
useIntl: () => ({ formatMessage: jest.fn(({ id }) => en[id]) }),
|
||||||
|
}));
|
||||||
|
|
||||||
|
describe('ImageAssetCard', () => {
|
||||||
|
it('snapshots the component', () => {
|
||||||
|
const { container } = renderTL(
|
||||||
|
<ThemeProvider theme={lightTheme}>
|
||||||
|
<ImageAssetCard
|
||||||
|
name="hello.png"
|
||||||
|
extension="png"
|
||||||
|
height={40}
|
||||||
|
width={40}
|
||||||
|
thumbnail="http://somewhere.com/hello.png"
|
||||||
|
/>
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
|
||||||
|
expect(container).toMatchInlineSnapshot(`
|
||||||
|
.c21 {
|
||||||
|
border: 0;
|
||||||
|
-webkit-clip: rect(0 0 0 0);
|
||||||
|
clip: rect(0 0 0 0);
|
||||||
|
height: 1px;
|
||||||
|
margin: -1px;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 0;
|
||||||
|
position: absolute;
|
||||||
|
width: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c0 {
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 4px;
|
||||||
|
box-shadow: 0px 1px 4px rgba(33,33,52,0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.c10 {
|
||||||
|
padding-top: 8px;
|
||||||
|
padding-right: 12px;
|
||||||
|
padding-bottom: 8px;
|
||||||
|
padding-left: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c15 {
|
||||||
|
background: #f6f6f9;
|
||||||
|
color: #666687;
|
||||||
|
padding: 4px;
|
||||||
|
border-radius: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c3 {
|
||||||
|
position: absolute;
|
||||||
|
top: 12px;
|
||||||
|
left: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c5 {
|
||||||
|
position: absolute;
|
||||||
|
top: 12px;
|
||||||
|
right: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c1 {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-flex-direction: row;
|
||||||
|
-ms-flex-direction: row;
|
||||||
|
flex-direction: row;
|
||||||
|
-webkit-box-pack: center;
|
||||||
|
-webkit-justify-content: center;
|
||||||
|
-ms-flex-pack: center;
|
||||||
|
justify-content: center;
|
||||||
|
-webkit-align-items: center;
|
||||||
|
-webkit-box-align: center;
|
||||||
|
-ms-flex-align: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c11 {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-flex-direction: row;
|
||||||
|
-ms-flex-direction: row;
|
||||||
|
flex-direction: row;
|
||||||
|
-webkit-align-items: center;
|
||||||
|
-webkit-box-align: center;
|
||||||
|
-ms-flex-align: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c9 {
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
max-height: 100%;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c8 {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-box-pack: center;
|
||||||
|
-webkit-justify-content: center;
|
||||||
|
-ms-flex-pack: center;
|
||||||
|
justify-content: center;
|
||||||
|
height: 10.25rem;
|
||||||
|
width: 100%;
|
||||||
|
background: repeating-conic-gradient(#f6f6f9 0% 25%,transparent 0% 50%) 50% / 20px 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c12 {
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 0.75rem;
|
||||||
|
line-height: 1.33;
|
||||||
|
color: #32324d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c13 {
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 0.75rem;
|
||||||
|
line-height: 1.33;
|
||||||
|
color: #666687;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c18 {
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 0.875rem;
|
||||||
|
line-height: 1.43;
|
||||||
|
color: #32324d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c19 {
|
||||||
|
font-weight: 600;
|
||||||
|
line-height: 1.14;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c20 {
|
||||||
|
font-weight: 600;
|
||||||
|
font-size: 0.6875rem;
|
||||||
|
line-height: 1.45;
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c16 {
|
||||||
|
display: inline-block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c17 {
|
||||||
|
margin-left: auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4 {
|
||||||
|
margin: 0;
|
||||||
|
height: 18px;
|
||||||
|
min-width: 18px;
|
||||||
|
border-radius: 4px;
|
||||||
|
border: 1px solid #c0c0cf;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:checked {
|
||||||
|
background-color: #4945ff;
|
||||||
|
border: 1px solid #4945ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:checked:after {
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
position: relative;
|
||||||
|
background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGgKICAgIGQ9Ik04LjU1MzIzIDAuMzk2OTczQzguNjMxMzUgMC4zMTYzNTUgOC43NjA1MSAwLjMxNTgxMSA4LjgzOTMxIDAuMzk1NzY4TDkuODYyNTYgMS40MzQwN0M5LjkzODkzIDEuNTExNTcgOS45MzkzNSAxLjYzNTkgOS44NjM0OSAxLjcxMzlMNC4wNjQwMSA3LjY3NzI0QzMuOTg1OSA3Ljc1NzU1IDMuODU3MDcgNy43NTgwNSAzLjc3ODM0IDcuNjc4MzRMMC4xMzg2NiAzLjk5MzMzQzAuMDYxNzc5OCAzLjkxNTQ5IDAuMDYxNzEwMiAzLjc5MDMyIDAuMTM4NTA0IDMuNzEyNEwxLjE2MjEzIDIuNjczNzJDMS4yNDAzOCAyLjU5NDMyIDEuMzY4NDMgMi41OTQyMiAxLjQ0NjggMi42NzM0OEwzLjkyMTc0IDUuMTc2NDdMOC41NTMyMyAwLjM5Njk3M1oiCiAgICBmaWxsPSJ3aGl0ZSIKICAvPgo8L3N2Zz4=) no-repeat no-repeat center center;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
left: 50%;
|
||||||
|
top: 50%;
|
||||||
|
-webkit-transform: translateX(-50%) translateY(-50%);
|
||||||
|
-ms-transform: translateX(-50%) translateY(-50%);
|
||||||
|
transform: translateX(-50%) translateY(-50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:checked:disabled:after {
|
||||||
|
background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGgKICAgIGQ9Ik04LjU1MzIzIDAuMzk2OTczQzguNjMxMzUgMC4zMTYzNTUgOC43NjA1MSAwLjMxNTgxMSA4LjgzOTMxIDAuMzk1NzY4TDkuODYyNTYgMS40MzQwN0M5LjkzODkzIDEuNTExNTcgOS45MzkzNSAxLjYzNTkgOS44NjM0OSAxLjcxMzlMNC4wNjQwMSA3LjY3NzI0QzMuOTg1OSA3Ljc1NzU1IDMuODU3MDcgNy43NTgwNSAzLjc3ODM0IDcuNjc4MzRMMC4xMzg2NiAzLjk5MzMzQzAuMDYxNzc5OCAzLjkxNTQ5IDAuMDYxNzEwMiAzLjc5MDMyIDAuMTM4NTA0IDMuNzEyNEwxLjE2MjEzIDIuNjczNzJDMS4yNDAzOCAyLjU5NDMyIDEuMzY4NDMgMi41OTQyMiAxLjQ0NjggMi42NzM0OEwzLjkyMTc0IDUuMTc2NDdMOC41NTMyMyAwLjM5Njk3M1oiCiAgICBmaWxsPSIjOEU4RUE5IgogIC8+Cjwvc3ZnPg==) no-repeat no-repeat center center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:disabled {
|
||||||
|
background-color: #dcdce4;
|
||||||
|
border: 1px solid #c0c0cf;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:indeterminate {
|
||||||
|
background-color: #4945ff;
|
||||||
|
border: 1px solid #4945ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:indeterminate:after {
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
position: relative;
|
||||||
|
color: white;
|
||||||
|
height: 2px;
|
||||||
|
width: 10px;
|
||||||
|
background-color: #ffffff;
|
||||||
|
left: 50%;
|
||||||
|
top: 50%;
|
||||||
|
-webkit-transform: translateX(-50%) translateY(-50%);
|
||||||
|
-ms-transform: translateX(-50%) translateY(-50%);
|
||||||
|
transform: translateX(-50%) translateY(-50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:indeterminate:disabled {
|
||||||
|
background-color: #dcdce4;
|
||||||
|
border: 1px solid #c0c0cf;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:indeterminate:disabled:after {
|
||||||
|
background-color: #8e8ea9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c2 {
|
||||||
|
position: relative;
|
||||||
|
border-bottom: 1px solid #eaeaef;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c6 {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 8px;
|
||||||
|
border-radius: 4px;
|
||||||
|
background: #ffffff;
|
||||||
|
border: 1px solid #dcdce4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c6 svg {
|
||||||
|
height: 12px;
|
||||||
|
width: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c6 svg > g,
|
||||||
|
.c6 svg path {
|
||||||
|
fill: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c6[aria-disabled='true'] {
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c7 svg > g,
|
||||||
|
.c7 svg path {
|
||||||
|
fill: #8e8ea9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c7:hover svg > g,
|
||||||
|
.c7:hover svg path {
|
||||||
|
fill: #666687;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c7:active svg > g,
|
||||||
|
.c7:active svg path {
|
||||||
|
fill: #a5a5ba;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c7[aria-disabled='true'] {
|
||||||
|
background-color: #eaeaef;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c7[aria-disabled='true'] svg path {
|
||||||
|
fill: #666687;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c14 {
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<article
|
||||||
|
aria-labelledby="card-1-title"
|
||||||
|
class="c0"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="c1 c2"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="c3"
|
||||||
|
>
|
||||||
|
<input
|
||||||
|
aria-labelledby="card-1-title"
|
||||||
|
checked=""
|
||||||
|
class="c4"
|
||||||
|
type="checkbox"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="c5"
|
||||||
|
>
|
||||||
|
<span>
|
||||||
|
<button
|
||||||
|
aria-disabled="false"
|
||||||
|
aria-labelledby="tooltip-1"
|
||||||
|
class="c6 c7"
|
||||||
|
tabindex="0"
|
||||||
|
type="button"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
fill="none"
|
||||||
|
height="1em"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
width="1em"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
clip-rule="evenodd"
|
||||||
|
d="M23.604 3.514c.528.528.528 1.36 0 1.887l-2.622 2.607-4.99-4.99L18.6.396a1.322 1.322 0 011.887 0l3.118 3.118zM0 24v-4.99l14.2-14.2 4.99 4.99L4.99 24H0z"
|
||||||
|
fill="#212134"
|
||||||
|
fill-rule="evenodd"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="c8"
|
||||||
|
>
|
||||||
|
<img
|
||||||
|
aria-hidden="true"
|
||||||
|
class="c9"
|
||||||
|
src="http://somewhere.com/hello.png"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="c10"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="c11"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class=""
|
||||||
|
>
|
||||||
|
<h2
|
||||||
|
class="c12"
|
||||||
|
id="card-1-title"
|
||||||
|
>
|
||||||
|
hello.png
|
||||||
|
</h2>
|
||||||
|
<div
|
||||||
|
class="c13"
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
class="c14"
|
||||||
|
>
|
||||||
|
png
|
||||||
|
</span>
|
||||||
|
- 40✕40
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="c15 c16 c17"
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
class="c18 c19 c20"
|
||||||
|
>
|
||||||
|
Image
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
<div
|
||||||
|
class="c21"
|
||||||
|
>
|
||||||
|
<p
|
||||||
|
aria-live="polite"
|
||||||
|
aria-relevant="all"
|
||||||
|
id="live-region-log"
|
||||||
|
role="log"
|
||||||
|
/>
|
||||||
|
<p
|
||||||
|
aria-live="polite"
|
||||||
|
aria-relevant="all"
|
||||||
|
id="live-region-status"
|
||||||
|
role="status"
|
||||||
|
/>
|
||||||
|
<p
|
||||||
|
aria-live="assertive"
|
||||||
|
aria-relevant="all"
|
||||||
|
id="live-region-alert"
|
||||||
|
role="alert"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`);
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -0,0 +1,444 @@
|
|||||||
|
import React from 'react';
|
||||||
|
import { ThemeProvider, lightTheme } from '@strapi/parts';
|
||||||
|
import { render as renderTL } from '@testing-library/react';
|
||||||
|
import { UnknownAssetCard } from '../UnknownAssetCard';
|
||||||
|
import en from '../../../translations/en.json';
|
||||||
|
|
||||||
|
jest.mock('../../../utils', () => ({
|
||||||
|
...jest.requireActual('../../../utils'),
|
||||||
|
getTrad: x => x,
|
||||||
|
}));
|
||||||
|
|
||||||
|
jest.mock('react-intl', () => ({
|
||||||
|
useIntl: () => ({ formatMessage: jest.fn(({ id }) => en[id]) }),
|
||||||
|
}));
|
||||||
|
|
||||||
|
describe('UnknownAssetCard', () => {
|
||||||
|
it('snapshots the component', () => {
|
||||||
|
const { container } = renderTL(
|
||||||
|
<ThemeProvider theme={lightTheme}>
|
||||||
|
<UnknownAssetCard name="hello.png" extension="png" />
|
||||||
|
</ThemeProvider>
|
||||||
|
);
|
||||||
|
|
||||||
|
expect(container).toMatchInlineSnapshot(`
|
||||||
|
.c15 {
|
||||||
|
border: 0;
|
||||||
|
-webkit-clip: rect(0 0 0 0);
|
||||||
|
clip: rect(0 0 0 0);
|
||||||
|
height: 1px;
|
||||||
|
margin: -1px;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 0;
|
||||||
|
position: absolute;
|
||||||
|
width: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c0 {
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 4px;
|
||||||
|
box-shadow: 0px 1px 4px rgba(33,33,52,0.1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.c11 {
|
||||||
|
padding-top: 8px;
|
||||||
|
padding-right: 12px;
|
||||||
|
padding-bottom: 8px;
|
||||||
|
padding-left: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c3 {
|
||||||
|
position: absolute;
|
||||||
|
top: 12px;
|
||||||
|
left: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c5 {
|
||||||
|
position: absolute;
|
||||||
|
top: 12px;
|
||||||
|
right: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c1 {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-flex-direction: row;
|
||||||
|
-ms-flex-direction: row;
|
||||||
|
flex-direction: row;
|
||||||
|
-webkit-box-pack: center;
|
||||||
|
-webkit-justify-content: center;
|
||||||
|
-ms-flex-pack: center;
|
||||||
|
justify-content: center;
|
||||||
|
-webkit-align-items: center;
|
||||||
|
-webkit-box-align: center;
|
||||||
|
-ms-flex-align: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c9 {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-flex-direction: row;
|
||||||
|
-ms-flex-direction: row;
|
||||||
|
flex-direction: row;
|
||||||
|
-webkit-align-items: center;
|
||||||
|
-webkit-box-align: center;
|
||||||
|
-ms-flex-align: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c8 {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
-webkit-box-pack: center;
|
||||||
|
-webkit-justify-content: center;
|
||||||
|
-ms-flex-pack: center;
|
||||||
|
justify-content: center;
|
||||||
|
height: 10.25rem;
|
||||||
|
width: 100%;
|
||||||
|
background: repeating-conic-gradient(#f6f6f9 0% 25%,transparent 0% 50%) 50% / 20px 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c12 {
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 0.75rem;
|
||||||
|
line-height: 1.33;
|
||||||
|
color: #32324d;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c13 {
|
||||||
|
font-weight: 400;
|
||||||
|
font-size: 0.75rem;
|
||||||
|
line-height: 1.33;
|
||||||
|
color: #666687;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4 {
|
||||||
|
margin: 0;
|
||||||
|
height: 18px;
|
||||||
|
min-width: 18px;
|
||||||
|
border-radius: 4px;
|
||||||
|
border: 1px solid #c0c0cf;
|
||||||
|
-webkit-appearance: none;
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:checked {
|
||||||
|
background-color: #4945ff;
|
||||||
|
border: 1px solid #4945ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:checked:after {
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
position: relative;
|
||||||
|
background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGgKICAgIGQ9Ik04LjU1MzIzIDAuMzk2OTczQzguNjMxMzUgMC4zMTYzNTUgOC43NjA1MSAwLjMxNTgxMSA4LjgzOTMxIDAuMzk1NzY4TDkuODYyNTYgMS40MzQwN0M5LjkzODkzIDEuNTExNTcgOS45MzkzNSAxLjYzNTkgOS44NjM0OSAxLjcxMzlMNC4wNjQwMSA3LjY3NzI0QzMuOTg1OSA3Ljc1NzU1IDMuODU3MDcgNy43NTgwNSAzLjc3ODM0IDcuNjc4MzRMMC4xMzg2NiAzLjk5MzMzQzAuMDYxNzc5OCAzLjkxNTQ5IDAuMDYxNzEwMiAzLjc5MDMyIDAuMTM4NTA0IDMuNzEyNEwxLjE2MjEzIDIuNjczNzJDMS4yNDAzOCAyLjU5NDMyIDEuMzY4NDMgMi41OTQyMiAxLjQ0NjggMi42NzM0OEwzLjkyMTc0IDUuMTc2NDdMOC41NTMyMyAwLjM5Njk3M1oiCiAgICBmaWxsPSJ3aGl0ZSIKICAvPgo8L3N2Zz4=) no-repeat no-repeat center center;
|
||||||
|
width: 10px;
|
||||||
|
height: 10px;
|
||||||
|
left: 50%;
|
||||||
|
top: 50%;
|
||||||
|
-webkit-transform: translateX(-50%) translateY(-50%);
|
||||||
|
-ms-transform: translateX(-50%) translateY(-50%);
|
||||||
|
transform: translateX(-50%) translateY(-50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:checked:disabled:after {
|
||||||
|
background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTAiIGhlaWdodD0iOCIgdmlld0JveD0iMCAwIDEwIDgiIGZpbGw9Im5vbmUiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+CiAgPHBhdGgKICAgIGQ9Ik04LjU1MzIzIDAuMzk2OTczQzguNjMxMzUgMC4zMTYzNTUgOC43NjA1MSAwLjMxNTgxMSA4LjgzOTMxIDAuMzk1NzY4TDkuODYyNTYgMS40MzQwN0M5LjkzODkzIDEuNTExNTcgOS45MzkzNSAxLjYzNTkgOS44NjM0OSAxLjcxMzlMNC4wNjQwMSA3LjY3NzI0QzMuOTg1OSA3Ljc1NzU1IDMuODU3MDcgNy43NTgwNSAzLjc3ODM0IDcuNjc4MzRMMC4xMzg2NiAzLjk5MzMzQzAuMDYxNzc5OCAzLjkxNTQ5IDAuMDYxNzEwMiAzLjc5MDMyIDAuMTM4NTA0IDMuNzEyNEwxLjE2MjEzIDIuNjczNzJDMS4yNDAzOCAyLjU5NDMyIDEuMzY4NDMgMi41OTQyMiAxLjQ0NjggMi42NzM0OEwzLjkyMTc0IDUuMTc2NDdMOC41NTMyMyAwLjM5Njk3M1oiCiAgICBmaWxsPSIjOEU4RUE5IgogIC8+Cjwvc3ZnPg==) no-repeat no-repeat center center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:disabled {
|
||||||
|
background-color: #dcdce4;
|
||||||
|
border: 1px solid #c0c0cf;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:indeterminate {
|
||||||
|
background-color: #4945ff;
|
||||||
|
border: 1px solid #4945ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:indeterminate:after {
|
||||||
|
content: '';
|
||||||
|
display: block;
|
||||||
|
position: relative;
|
||||||
|
color: white;
|
||||||
|
height: 2px;
|
||||||
|
width: 10px;
|
||||||
|
background-color: #ffffff;
|
||||||
|
left: 50%;
|
||||||
|
top: 50%;
|
||||||
|
-webkit-transform: translateX(-50%) translateY(-50%);
|
||||||
|
-ms-transform: translateX(-50%) translateY(-50%);
|
||||||
|
transform: translateX(-50%) translateY(-50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:indeterminate:disabled {
|
||||||
|
background-color: #dcdce4;
|
||||||
|
border: 1px solid #c0c0cf;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c4:indeterminate:disabled:after {
|
||||||
|
background-color: #8e8ea9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c2 {
|
||||||
|
position: relative;
|
||||||
|
border-bottom: 1px solid #eaeaef;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c6 {
|
||||||
|
display: -webkit-box;
|
||||||
|
display: -webkit-flex;
|
||||||
|
display: -ms-flexbox;
|
||||||
|
display: flex;
|
||||||
|
cursor: pointer;
|
||||||
|
padding: 8px;
|
||||||
|
border-radius: 4px;
|
||||||
|
background: #ffffff;
|
||||||
|
border: 1px solid #dcdce4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c6 svg {
|
||||||
|
height: 12px;
|
||||||
|
width: 12px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c6 svg > g,
|
||||||
|
.c6 svg path {
|
||||||
|
fill: #ffffff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c6[aria-disabled='true'] {
|
||||||
|
pointer-events: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c7 svg > g,
|
||||||
|
.c7 svg path {
|
||||||
|
fill: #8e8ea9;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c7:hover svg > g,
|
||||||
|
.c7:hover svg path {
|
||||||
|
fill: #666687;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c7:active svg > g,
|
||||||
|
.c7:active svg path {
|
||||||
|
fill: #a5a5ba;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c7[aria-disabled='true'] {
|
||||||
|
background-color: #eaeaef;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c7[aria-disabled='true'] svg path {
|
||||||
|
fill: #666687;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c14 {
|
||||||
|
text-transform: uppercase;
|
||||||
|
}
|
||||||
|
|
||||||
|
.c10 svg {
|
||||||
|
font-size: 3rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
<div>
|
||||||
|
<article
|
||||||
|
aria-labelledby="card-1-title"
|
||||||
|
class="c0"
|
||||||
|
tabindex="0"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="c1 c2"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="c3"
|
||||||
|
>
|
||||||
|
<input
|
||||||
|
aria-labelledby="card-1-title"
|
||||||
|
checked=""
|
||||||
|
class="c4"
|
||||||
|
type="checkbox"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="c5"
|
||||||
|
>
|
||||||
|
<span>
|
||||||
|
<button
|
||||||
|
aria-disabled="false"
|
||||||
|
aria-labelledby="tooltip-1"
|
||||||
|
class="c6 c7"
|
||||||
|
tabindex="0"
|
||||||
|
type="button"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
fill="none"
|
||||||
|
height="1em"
|
||||||
|
viewBox="0 0 24 24"
|
||||||
|
width="1em"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
clip-rule="evenodd"
|
||||||
|
d="M23.604 3.514c.528.528.528 1.36 0 1.887l-2.622 2.607-4.99-4.99L18.6.396a1.322 1.322 0 011.887 0l3.118 3.118zM0 24v-4.99l14.2-14.2 4.99 4.99L4.99 24H0z"
|
||||||
|
fill="#212134"
|
||||||
|
fill-rule="evenodd"
|
||||||
|
/>
|
||||||
|
</svg>
|
||||||
|
</button>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="c8"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="c9"
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
class="c10"
|
||||||
|
>
|
||||||
|
<svg
|
||||||
|
aria-label="hello.png"
|
||||||
|
fill="none"
|
||||||
|
height="1em"
|
||||||
|
viewBox="0 0 216 120"
|
||||||
|
width="1em"
|
||||||
|
xmlns="http://www.w3.org/2000/svg"
|
||||||
|
>
|
||||||
|
<g
|
||||||
|
opacity="0.8"
|
||||||
|
>
|
||||||
|
<path
|
||||||
|
clip-rule="evenodd"
|
||||||
|
d="M119 28a7 7 0 110 14h64a7 7 0 110 14h22a7 7 0 110 14h-19a7 7 0 100 14h6a7 7 0 110 14h-52a7.024 7.024 0 01-1.5-.161A7.024 7.024 0 01137 98H46a7 7 0 110-14H7a7 7 0 110-14h40a7 7 0 100-14H22a7 7 0 110-14h40a7 7 0 110-14h57zm90 56a7 7 0 110 14 7 7 0 010-14z"
|
||||||
|
fill="#D9D8FF"
|
||||||
|
fill-rule="evenodd"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
clip-rule="evenodd"
|
||||||
|
d="M69.278 103.123l-4.07.572a4 4 0 01-4.517-3.404L49.557 21.069a4 4 0 013.404-4.518l78.231-10.994a4 4 0 014.518 3.404l.957 6.808"
|
||||||
|
fill="#fff"
|
||||||
|
fill-rule="evenodd"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
clip-rule="evenodd"
|
||||||
|
d="M71.805 98.712l-3.696.526a3.618 3.618 0 01-4.096-3.085l-9.996-71.925a3.646 3.646 0 013.097-4.108l71.038-10.096a3.619 3.619 0 014.097 3.085l.859 6.18 9.205 66.599c.306 2.212-1.22 4.257-3.408 4.566a4.192 4.192 0 01-.07.01l-67.03 8.248z"
|
||||||
|
fill="#F0F0FF"
|
||||||
|
fill-rule="evenodd"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M69.278 103.123l-4.07.572a4 4 0 01-4.517-3.404L49.557 21.069a4 4 0 013.404-4.518l78.231-10.994a4 4 0 014.518 3.404l.957 6.808M137.5 20.38l.5 3.12"
|
||||||
|
stroke="#4945FF"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-opacity="0.83"
|
||||||
|
stroke-width="2.5"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
clip-rule="evenodd"
|
||||||
|
d="M164.411 30.299L85.844 22.04a2.74 2.74 0 00-2.018.598 2.741 2.741 0 00-1.004 1.85l-8.363 79.561c-.079.755.155 1.471.598 2.018a2.74 2.74 0 001.85 1.004l78.567 8.258a2.739 2.739 0 002.018-.598 2.741 2.741 0 001.005-1.849l8.362-79.562a2.743 2.743 0 00-.598-2.018 2.74 2.74 0 00-1.85-1.004z"
|
||||||
|
fill="#fff"
|
||||||
|
fill-rule="evenodd"
|
||||||
|
stroke="#4945FF"
|
||||||
|
stroke-opacity="0.83"
|
||||||
|
stroke-width="2.5"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
clip-rule="evenodd"
|
||||||
|
d="M92.99 30.585l62.655 6.585a3 3 0 012.67 3.297l-5.54 52.71a3 3 0 01-3.297 2.67L86.823 89.26a3 3 0 01-2.67-3.297l5.54-52.71a3 3 0 013.297-2.67z"
|
||||||
|
fill="#fff"
|
||||||
|
fill-rule="evenodd"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
clip-rule="evenodd"
|
||||||
|
d="M92.74 73.878l9.798-6.608a4 4 0 015.168.594l7.173 7.723a1 1 0 001.362.096l15.34-12.43a4 4 0 015.878.936l9.98 15.438 1.434 2.392-.687 8.124a1 1 0 01-1.08.913l-.026-.003-56.963-6.329a1 1 0 01-.886-1.085l.755-8.199 2.755-1.562z"
|
||||||
|
fill="#F0F0FF"
|
||||||
|
fill-rule="evenodd"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
clip-rule="evenodd"
|
||||||
|
d="M155.514 38.413l-62.655-6.585c-.48-.05-.936.098-1.284.38a1.744 1.744 0 00-.639 1.177l-5.54 52.71c-.05.48.099.936.38 1.284.282.348.697.589 1.178.64l62.654 6.585a1.746 1.746 0 001.924-1.558l5.54-52.71c.05-.48-.099-.936-.381-1.284a1.744 1.744 0 00-1.177-.639z"
|
||||||
|
stroke="#4945FF"
|
||||||
|
stroke-opacity="0.83"
|
||||||
|
stroke-width="2.5"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M104.405 55.916a6 6 0 101.254-11.933 6 6 0 00-1.254 11.934z"
|
||||||
|
fill="#F0F0FF"
|
||||||
|
stroke="#4945FF"
|
||||||
|
stroke-opacity="0.83"
|
||||||
|
stroke-width="2.5"
|
||||||
|
/>
|
||||||
|
<path
|
||||||
|
d="M90.729 75.425l11.809-8.155a4 4 0 015.168.594l7.173 7.723a1 1 0 001.362.096l15.34-12.43a4 4 0 015.878.936l11.064 17.557"
|
||||||
|
stroke="#4945FF"
|
||||||
|
stroke-linecap="round"
|
||||||
|
stroke-opacity="0.83"
|
||||||
|
stroke-width="2.5"
|
||||||
|
/>
|
||||||
|
</g>
|
||||||
|
</svg>
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div
|
||||||
|
class="c11"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class="c9"
|
||||||
|
>
|
||||||
|
<div
|
||||||
|
class=""
|
||||||
|
>
|
||||||
|
<h2
|
||||||
|
class="c12"
|
||||||
|
id="card-1-title"
|
||||||
|
>
|
||||||
|
hello.png
|
||||||
|
</h2>
|
||||||
|
<div
|
||||||
|
class="c13"
|
||||||
|
>
|
||||||
|
<span
|
||||||
|
class="c14"
|
||||||
|
>
|
||||||
|
png
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</article>
|
||||||
|
<div
|
||||||
|
class="c15"
|
||||||
|
>
|
||||||
|
<p
|
||||||
|
aria-live="polite"
|
||||||
|
aria-relevant="all"
|
||||||
|
id="live-region-log"
|
||||||
|
role="log"
|
||||||
|
/>
|
||||||
|
<p
|
||||||
|
aria-live="polite"
|
||||||
|
aria-relevant="all"
|
||||||
|
id="live-region-status"
|
||||||
|
role="status"
|
||||||
|
/>
|
||||||
|
<p
|
||||||
|
aria-live="assertive"
|
||||||
|
aria-relevant="all"
|
||||||
|
id="live-region-alert"
|
||||||
|
role="alert"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
`);
|
||||||
|
});
|
||||||
|
});
|
||||||
@ -1,4 +1,4 @@
|
|||||||
import React from 'react';
|
import React, { useState } from 'react';
|
||||||
import PropTypes from 'prop-types';
|
import PropTypes from 'prop-types';
|
||||||
import { Box } from '@strapi/parts/Box';
|
import { Box } from '@strapi/parts/Box';
|
||||||
import { ModalFooter } from '@strapi/parts/ModalLayout';
|
import { ModalFooter } from '@strapi/parts/ModalLayout';
|
||||||
@ -11,12 +11,15 @@ import { getTrad, urlSchema } from '../../../utils';
|
|||||||
import { urlsToAssets } from '../../../utils/urlsToAssets';
|
import { urlsToAssets } from '../../../utils/urlsToAssets';
|
||||||
|
|
||||||
export const FromUrlForm = ({ onClose, onAddAsset }) => {
|
export const FromUrlForm = ({ onClose, onAddAsset }) => {
|
||||||
|
const [loading, setLoading] = useState(false);
|
||||||
const { formatMessage } = useIntl();
|
const { formatMessage } = useIntl();
|
||||||
|
|
||||||
const handleSubmit = async ({ urls }) => {
|
const handleSubmit = async ({ urls }) => {
|
||||||
|
setLoading(true);
|
||||||
const urlArray = urls.split(/\r?\n/);
|
const urlArray = urls.split(/\r?\n/);
|
||||||
const assets = await urlsToAssets(urlArray);
|
const assets = await urlsToAssets(urlArray);
|
||||||
|
|
||||||
|
// no need to set the loading to false since the component unmounts
|
||||||
onAddAsset(assets);
|
onAddAsset(assets);
|
||||||
};
|
};
|
||||||
|
|
||||||
@ -53,7 +56,7 @@ export const FromUrlForm = ({ onClose, onAddAsset }) => {
|
|||||||
|
|
||||||
<ModalFooter
|
<ModalFooter
|
||||||
startActions={
|
startActions={
|
||||||
<Button onClick={onClose} variant="tertiary">
|
<Button onClick={onClose} variant="tertiary" loading={loading}>
|
||||||
{formatMessage({ id: 'app.components.Button.cancel', defaultMessage: 'cancel' })}
|
{formatMessage({ id: 'app.components.Button.cancel', defaultMessage: 'cancel' })}
|
||||||
</Button>
|
</Button>
|
||||||
}
|
}
|
||||||
|
|||||||
@ -3,7 +3,7 @@ import { ThemeProvider, lightTheme } from '@strapi/parts';
|
|||||||
import { render as renderTL, screen, fireEvent, waitFor } from '@testing-library/react';
|
import { render as renderTL, screen, fireEvent, waitFor } from '@testing-library/react';
|
||||||
import { FromUrlForm } from '../FromUrlForm';
|
import { FromUrlForm } from '../FromUrlForm';
|
||||||
import en from '../../../../translations/en.json';
|
import en from '../../../../translations/en.json';
|
||||||
import { mockAssets } from './server';
|
import { server } from './server';
|
||||||
|
|
||||||
jest.mock('../../../../utils', () => ({
|
jest.mock('../../../../utils', () => ({
|
||||||
...jest.requireActual('../../../../utils'),
|
...jest.requireActual('../../../../utils'),
|
||||||
@ -15,7 +15,9 @@ jest.mock('react-intl', () => ({
|
|||||||
}));
|
}));
|
||||||
|
|
||||||
describe('FromUrlForm', () => {
|
describe('FromUrlForm', () => {
|
||||||
beforeAll(mockAssets);
|
beforeAll(() => server.listen());
|
||||||
|
afterEach(() => server.resetHandlers());
|
||||||
|
afterAll(() => server.close());
|
||||||
|
|
||||||
it('snapshots the component with 4 URLs: 3 valid and one in failure', async () => {
|
it('snapshots the component with 4 URLs: 3 valid and one in failure', async () => {
|
||||||
const onAddAssetSpy = jest.fn();
|
const onAddAssetSpy = jest.fn();
|
||||||
@ -60,9 +62,9 @@ describe('FromUrlForm', () => {
|
|||||||
},
|
},
|
||||||
{
|
{
|
||||||
ext: 'lutin',
|
ext: 'lutin',
|
||||||
mime: undefined,
|
mime: 'application/json',
|
||||||
source: 'url',
|
source: 'url',
|
||||||
type: 'unknown',
|
type: 'doc',
|
||||||
url: 'http://localhost:5000/not-working-like-cors.lutin',
|
url: 'http://localhost:5000/not-working-like-cors.lutin',
|
||||||
},
|
},
|
||||||
];
|
];
|
||||||
|
|||||||
@ -1,26 +1,40 @@
|
|||||||
// mocking window.fetch since msw is not able to give back the res.url param
|
// mocking window.fetch since msw is not able to give back the res.url param
|
||||||
|
|
||||||
export const mockAssets = () => {
|
import { rest } from 'msw';
|
||||||
window.fetch = url => {
|
import { setupServer } from 'msw/node';
|
||||||
if (url === 'http://localhost:5000/an-image.png') {
|
|
||||||
const headers = { get: () => 'image/png' };
|
|
||||||
|
|
||||||
return Promise.resolve({ url: 'http://localhost:5000/an-image.png', headers });
|
export const server = setupServer(
|
||||||
}
|
rest.get('*/an-image.png', (req, res, ctx) =>
|
||||||
|
res(ctx.set('Content-Type', 'image/png'), ctx.body())
|
||||||
|
),
|
||||||
|
rest.get('*/a-pdf.pdf', (req, res, ctx) =>
|
||||||
|
res(ctx.set('Content-Type', 'application/pdf'), ctx.body())
|
||||||
|
),
|
||||||
|
rest.get('*/a-video.mp4', (req, res, ctx) =>
|
||||||
|
res(ctx.set('Content-Type', 'video/mp4'), ctx.body())
|
||||||
|
),
|
||||||
|
rest.get('*/not-working-like-cors.lutin', (req, res, ctx) => res(ctx.json({})))
|
||||||
|
);
|
||||||
|
|
||||||
if (url === 'http://localhost:5000/a-pdf.pdf') {
|
// export const mockAssets = url => {
|
||||||
const headers = { get: () => 'application/pdf' };
|
// if (url === 'http://localhost:5000/an-image.png') {
|
||||||
|
// const headers = { get: () => 'image/png' };
|
||||||
|
|
||||||
return Promise.resolve({ url: 'http://localhost:5000/a-pdf.pdf', headers });
|
// return Promise.resolve({ url: 'http://localhost:5000/an-image.png', headers });
|
||||||
}
|
// }
|
||||||
|
|
||||||
if (url === 'http://localhost:5000/a-video.mp4') {
|
// if (url === 'http://localhost:5000/a-pdf.pdf') {
|
||||||
const headers = { get: () => 'video/mp4' };
|
// const headers = { get: () => 'application/pdf' };
|
||||||
|
|
||||||
return Promise.resolve({ url: 'http://localhost:5000/a-video.mp4', headers });
|
// return Promise.resolve({ url: 'http://localhost:5000/a-pdf.pdf', headers });
|
||||||
}
|
// }
|
||||||
|
|
||||||
// eslint-disable-next-line prefer-promise-reject-errors
|
// if (url === 'http://localhost:5000/a-video.mp4') {
|
||||||
return Promise.reject('http://localhost:5000/not-working-like-cors.lutin');
|
// const headers = { get: () => 'video/mp4' };
|
||||||
};
|
|
||||||
};
|
// return Promise.resolve({ url: 'http://localhost:5000/a-video.mp4', headers });
|
||||||
|
// }
|
||||||
|
|
||||||
|
// // eslint-disable-next-line prefer-promise-reject-errors
|
||||||
|
// return Promise.reject('http://localhost:5000/not-working-like-cors.lutin');
|
||||||
|
// };
|
||||||
|
|||||||
@ -1,12 +1,16 @@
|
|||||||
|
import axios from 'axios';
|
||||||
import { AssetType, AssetSource } from '../constants';
|
import { AssetType, AssetSource } from '../constants';
|
||||||
|
|
||||||
export const urlsToAssets = async urls => {
|
export const urlsToAssets = async urls => {
|
||||||
const assetPromises = urls.map(url =>
|
const assetPromises = urls.map(url =>
|
||||||
fetch(url)
|
axios
|
||||||
.then(res => ({ url: res.url, mime: res.headers.get('Content-Type') }))
|
.get(url, {
|
||||||
.catch(() => {
|
responseType: 'blob',
|
||||||
throw url;
|
|
||||||
})
|
})
|
||||||
|
.then(res => ({
|
||||||
|
url: res.config.url,
|
||||||
|
mime: res.headers['content-type'],
|
||||||
|
}))
|
||||||
);
|
);
|
||||||
// Retrieve the assets metadata
|
// Retrieve the assets metadata
|
||||||
const assetsResults = await Promise.allSettled(assetPromises);
|
const assetsResults = await Promise.allSettled(assetPromises);
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user