mirror of
https://github.com/strapi/strapi.git
synced 2025-12-27 15:13:21 +00:00
chrore: feedback fix Form tests
This commit is contained in:
Julie Plantey
parent
98154cacc1
commit
d20474630f
@ -1,649 +0,0 @@
|
||||
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
||||
|
||||
exports[`ApplicationInfosPage | Form should render and match snapshot 1`] = `
|
||||
.c26 {
|
||||
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;
|
||||
padding-top: 24px;
|
||||
padding-right: 32px;
|
||||
padding-bottom: 24px;
|
||||
padding-left: 32px;
|
||||
border-radius: 4px;
|
||||
box-shadow: 0px 1px 4px rgba(33,33,52,0.1);
|
||||
}
|
||||
|
||||
.c2 {
|
||||
padding-top: 16px;
|
||||
}
|
||||
|
||||
.c9 {
|
||||
background: #f6f6f9;
|
||||
padding: 8px;
|
||||
border-radius: 4px;
|
||||
border-color: #dcdce4;
|
||||
border: 1px solid #dcdce4;
|
||||
}
|
||||
|
||||
.c10 {
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.c12 {
|
||||
padding-right: 8px;
|
||||
padding-left: 8px;
|
||||
overflow: hidden;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.c14 {
|
||||
height: 124px;
|
||||
}
|
||||
|
||||
.c17 {
|
||||
max-width: 40%;
|
||||
max-height: 40%;
|
||||
}
|
||||
|
||||
.c18 {
|
||||
position: absolute;
|
||||
bottom: 4px;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.c23 {
|
||||
padding-top: 8px;
|
||||
padding-right: 16px;
|
||||
padding-left: 16px;
|
||||
}
|
||||
|
||||
.c3 {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(12,1fr);
|
||||
gap: 16px;
|
||||
}
|
||||
|
||||
.c4 {
|
||||
grid-column: span 6;
|
||||
max-width: 100%;
|
||||
}
|
||||
|
||||
.c1 {
|
||||
font-weight: 500;
|
||||
font-size: 1rem;
|
||||
line-height: 1.25;
|
||||
color: #32324d;
|
||||
}
|
||||
|
||||
.c7 {
|
||||
font-size: 0.75rem;
|
||||
line-height: 1.33;
|
||||
font-weight: 600;
|
||||
color: #32324d;
|
||||
}
|
||||
|
||||
.c24 {
|
||||
font-size: 0.75rem;
|
||||
line-height: 1.33;
|
||||
display: block;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
color: #666687;
|
||||
}
|
||||
|
||||
.c25 {
|
||||
font-size: 0.75rem;
|
||||
line-height: 1.33;
|
||||
color: #666687;
|
||||
}
|
||||
|
||||
.c5 {
|
||||
-webkit-align-items: stretch;
|
||||
-webkit-box-align: stretch;
|
||||
-ms-flex-align: stretch;
|
||||
align-items: stretch;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-flex-direction: column;
|
||||
-ms-flex-direction: column;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.c8 {
|
||||
-webkit-align-items: center;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-flex-direction: row;
|
||||
-ms-flex-direction: row;
|
||||
flex-direction: row;
|
||||
}
|
||||
|
||||
.c15 {
|
||||
-webkit-align-items: center;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
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;
|
||||
}
|
||||
|
||||
.c22 {
|
||||
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;
|
||||
}
|
||||
|
||||
.c11 {
|
||||
display: grid;
|
||||
grid-template-columns: auto 1fr auto;
|
||||
grid-template-areas: 'startAction slides endAction';
|
||||
}
|
||||
|
||||
.c13 {
|
||||
grid-area: slides;
|
||||
}
|
||||
|
||||
.c6 > * {
|
||||
margin-top: 0;
|
||||
margin-bottom: 0;
|
||||
}
|
||||
|
||||
.c6 > * + * {
|
||||
margin-top: 4px;
|
||||
}
|
||||
|
||||
.c19 > * {
|
||||
margin-left: 0;
|
||||
margin-right: 0;
|
||||
}
|
||||
|
||||
.c19 > * + * {
|
||||
margin-left: 4px;
|
||||
}
|
||||
|
||||
.c16 {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.c20 {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
cursor: pointer;
|
||||
padding: 8px;
|
||||
border-radius: 4px;
|
||||
background: #ffffff;
|
||||
border: 1px solid #dcdce4;
|
||||
position: relative;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.c20 svg {
|
||||
height: 12px;
|
||||
width: 12px;
|
||||
}
|
||||
|
||||
.c20 svg > g,
|
||||
.c20 svg path {
|
||||
fill: #ffffff;
|
||||
}
|
||||
|
||||
.c20[aria-disabled='true'] {
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.c20:after {
|
||||
-webkit-transition-property: all;
|
||||
transition-property: all;
|
||||
-webkit-transition-duration: 0.2s;
|
||||
transition-duration: 0.2s;
|
||||
border-radius: 8px;
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -4px;
|
||||
bottom: -4px;
|
||||
left: -4px;
|
||||
right: -4px;
|
||||
border: 2px solid transparent;
|
||||
}
|
||||
|
||||
.c20:focus-visible {
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.c20:focus-visible:after {
|
||||
border-radius: 8px;
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -5px;
|
||||
bottom: -5px;
|
||||
left: -5px;
|
||||
right: -5px;
|
||||
border: 2px solid #4945ff;
|
||||
}
|
||||
|
||||
.c21 {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: -ms-flexbox;
|
||||
display: flex;
|
||||
-webkit-align-items: center;
|
||||
-webkit-box-align: center;
|
||||
-ms-flex-align: center;
|
||||
align-items: center;
|
||||
-webkit-box-pack: center;
|
||||
-webkit-justify-content: center;
|
||||
-ms-flex-pack: center;
|
||||
justify-content: center;
|
||||
height: 2rem;
|
||||
width: 2rem;
|
||||
}
|
||||
|
||||
.c21 svg > g,
|
||||
.c21 svg path {
|
||||
fill: #8e8ea9;
|
||||
}
|
||||
|
||||
.c21:hover svg > g,
|
||||
.c21:hover svg path {
|
||||
fill: #666687;
|
||||
}
|
||||
|
||||
.c21:active svg > g,
|
||||
.c21:active svg path {
|
||||
fill: #a5a5ba;
|
||||
}
|
||||
|
||||
.c21[aria-disabled='true'] {
|
||||
background-color: #eaeaef;
|
||||
}
|
||||
|
||||
.c21[aria-disabled='true'] svg path {
|
||||
fill: #666687;
|
||||
}
|
||||
|
||||
@media (max-width:68.75rem) {
|
||||
.c4 {
|
||||
grid-column: span 12;
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width:34.375rem) {
|
||||
.c4 {
|
||||
grid-column: span;
|
||||
}
|
||||
}
|
||||
|
||||
<div>
|
||||
<div
|
||||
class="c0"
|
||||
>
|
||||
<h3
|
||||
class="c1"
|
||||
>
|
||||
Customization
|
||||
</h3>
|
||||
<div
|
||||
class="c2 c3"
|
||||
>
|
||||
<div
|
||||
class="c4"
|
||||
>
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div>
|
||||
<div
|
||||
class="c5 c6"
|
||||
spacing="1"
|
||||
>
|
||||
<label
|
||||
class="c7"
|
||||
for="carouselinput-1"
|
||||
>
|
||||
<div
|
||||
class="c8"
|
||||
>
|
||||
Menu logo
|
||||
</div>
|
||||
</label>
|
||||
<div
|
||||
class=""
|
||||
id="carouselinput-1"
|
||||
>
|
||||
<div
|
||||
class="c9"
|
||||
>
|
||||
<section
|
||||
aria-label="Menu logo"
|
||||
aria-roledescription="carousel"
|
||||
class="c10 c11"
|
||||
>
|
||||
<div
|
||||
aria-live="polite"
|
||||
class="c12 c13"
|
||||
overflow="hidden"
|
||||
width="100%"
|
||||
>
|
||||
<div
|
||||
aria-label="Logo slide"
|
||||
aria-roledescription="slide"
|
||||
class="c14 c15 c16"
|
||||
height="124px"
|
||||
role="group"
|
||||
>
|
||||
<img
|
||||
alt="Logo"
|
||||
class="c17"
|
||||
src="uploads/menu.jpeg"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="c18 c15 c19"
|
||||
spacing="1"
|
||||
width="100%"
|
||||
>
|
||||
<span>
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-labelledby="tooltip-2"
|
||||
class="c20 c21"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
class="c22"
|
||||
>
|
||||
Change logo
|
||||
</span>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
fill="none"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M24 13.604a.3.3 0 01-.3.3h-9.795V23.7a.3.3 0 01-.3.3h-3.21a.3.3 0 01-.3-.3v-9.795H.3a.3.3 0 01-.3-.3v-3.21a.3.3 0 01.3-.3h9.795V.3a.3.3 0 01.3-.3h3.21a.3.3 0 01.3.3v9.795H23.7a.3.3 0 01.3.3v3.21z"
|
||||
fill="#212134"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</span>
|
||||
<span>
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-labelledby="tooltip-4"
|
||||
class="c20 c21"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
class="c22"
|
||||
>
|
||||
Reset logo
|
||||
</span>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
fill="none"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
clip-rule="evenodd"
|
||||
d="M15.681 2.804A9.64 9.64 0 0011.818 2C6.398 2 2 6.48 2 12c0 5.521 4.397 10 9.818 10 2.03 0 4.011-.641 5.67-1.835a9.987 9.987 0 003.589-4.831 1.117 1.117 0 00-.664-1.418 1.086 1.086 0 00-1.393.676 7.769 7.769 0 01-2.792 3.758 7.546 7.546 0 01-4.41 1.428V4.222h.002a7.492 7.492 0 013.003.625 7.61 7.61 0 012.5 1.762l.464.551-2.986 3.042a.186.186 0 00.129.316H22V3.317a.188.188 0 00-.112-.172.179.179 0 00-.199.04l-2.355 2.4-.394-.468-.02-.02a9.791 9.791 0 00-3.239-2.293zm-3.863 1.418V2v2.222zm0 0v15.556c-4.216 0-7.636-3.484-7.636-7.778s3.42-7.777 7.636-7.778z"
|
||||
fill="#212134"
|
||||
fill-rule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</section>
|
||||
<div
|
||||
class="c23"
|
||||
>
|
||||
<span>
|
||||
<div
|
||||
aria-labelledby="tooltip-6"
|
||||
class="c15"
|
||||
tabindex="0"
|
||||
>
|
||||
<span
|
||||
class="c24"
|
||||
>
|
||||
menuLogo.jpeg
|
||||
</span>
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p
|
||||
class="c25"
|
||||
id="carouselinput-1-hint"
|
||||
>
|
||||
Change the admin panel logo (Max dimension: 750x750, Max file size: 100KB)
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="c4"
|
||||
>
|
||||
<div
|
||||
class=""
|
||||
>
|
||||
<div>
|
||||
<div
|
||||
class="c5 c6"
|
||||
spacing="1"
|
||||
>
|
||||
<label
|
||||
class="c7"
|
||||
for="carouselinput-8"
|
||||
>
|
||||
<div
|
||||
class="c8"
|
||||
>
|
||||
Auth logo
|
||||
</div>
|
||||
</label>
|
||||
<div
|
||||
class=""
|
||||
id="carouselinput-8"
|
||||
>
|
||||
<div
|
||||
class="c9"
|
||||
>
|
||||
<section
|
||||
aria-label="Auth logo"
|
||||
aria-roledescription="carousel"
|
||||
class="c10 c11"
|
||||
>
|
||||
<div
|
||||
aria-live="polite"
|
||||
class="c12 c13"
|
||||
overflow="hidden"
|
||||
width="100%"
|
||||
>
|
||||
<div
|
||||
aria-label="Logo slide"
|
||||
aria-roledescription="slide"
|
||||
class="c14 c15 c16"
|
||||
height="124px"
|
||||
role="group"
|
||||
>
|
||||
<img
|
||||
alt="Logo"
|
||||
class="c17"
|
||||
src="uploads/auth.jpeg"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="c18 c15 c19"
|
||||
spacing="1"
|
||||
width="100%"
|
||||
>
|
||||
<span>
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-labelledby="tooltip-9"
|
||||
class="c20 c21"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
class="c22"
|
||||
>
|
||||
Change logo
|
||||
</span>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
fill="none"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
d="M24 13.604a.3.3 0 01-.3.3h-9.795V23.7a.3.3 0 01-.3.3h-3.21a.3.3 0 01-.3-.3v-9.795H.3a.3.3 0 01-.3-.3v-3.21a.3.3 0 01.3-.3h9.795V.3a.3.3 0 01.3-.3h3.21a.3.3 0 01.3.3v9.795H23.7a.3.3 0 01.3.3v3.21z"
|
||||
fill="#212134"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</span>
|
||||
<span>
|
||||
<button
|
||||
aria-disabled="false"
|
||||
aria-labelledby="tooltip-11"
|
||||
class="c20 c21"
|
||||
tabindex="0"
|
||||
type="button"
|
||||
>
|
||||
<span
|
||||
class="c22"
|
||||
>
|
||||
Reset logo
|
||||
</span>
|
||||
<svg
|
||||
aria-hidden="true"
|
||||
fill="none"
|
||||
focusable="false"
|
||||
height="1em"
|
||||
viewBox="0 0 24 24"
|
||||
width="1em"
|
||||
xmlns="http://www.w3.org/2000/svg"
|
||||
>
|
||||
<path
|
||||
clip-rule="evenodd"
|
||||
d="M15.681 2.804A9.64 9.64 0 0011.818 2C6.398 2 2 6.48 2 12c0 5.521 4.397 10 9.818 10 2.03 0 4.011-.641 5.67-1.835a9.987 9.987 0 003.589-4.831 1.117 1.117 0 00-.664-1.418 1.086 1.086 0 00-1.393.676 7.769 7.769 0 01-2.792 3.758 7.546 7.546 0 01-4.41 1.428V4.222h.002a7.492 7.492 0 013.003.625 7.61 7.61 0 012.5 1.762l.464.551-2.986 3.042a.186.186 0 00.129.316H22V3.317a.188.188 0 00-.112-.172.179.179 0 00-.199.04l-2.355 2.4-.394-.468-.02-.02a9.791 9.791 0 00-3.239-2.293zm-3.863 1.418V2v2.222zm0 0v15.556c-4.216 0-7.636-3.484-7.636-7.778s3.42-7.777 7.636-7.778z"
|
||||
fill="#212134"
|
||||
fill-rule="evenodd"
|
||||
/>
|
||||
</svg>
|
||||
</button>
|
||||
</span>
|
||||
</div>
|
||||
</section>
|
||||
<div
|
||||
class="c23"
|
||||
>
|
||||
<span>
|
||||
<div
|
||||
aria-labelledby="tooltip-13"
|
||||
class="c15"
|
||||
tabindex="0"
|
||||
>
|
||||
<span
|
||||
class="c24"
|
||||
>
|
||||
authLogo.jpeg
|
||||
</span>
|
||||
</div>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<p
|
||||
class="c25"
|
||||
id="carouselinput-8-hint"
|
||||
>
|
||||
Change the authentication pages logo (Max dimension: 750x750, Max file size: 100KB)
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div
|
||||
class="c26"
|
||||
>
|
||||
<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>
|
||||
`;
|
||||
@ -46,15 +46,22 @@ const render = (props) =>
|
||||
);
|
||||
|
||||
describe('ApplicationInfosPage | Form', () => {
|
||||
it('should render and match snapshot', () => {
|
||||
const { container } = render();
|
||||
expect(container).toMatchSnapshot();
|
||||
});
|
||||
|
||||
it('should display logo inputs', () => {
|
||||
const { getByText } = render();
|
||||
|
||||
expect(getByText('Menu logo')).toBeInTheDocument();
|
||||
expect(getByText('Auth logo')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('should disable logo input actions if users do not have update permissions', () => {
|
||||
const { getAllByRole } = render({ canUpdate: false });
|
||||
|
||||
getAllByRole('button', { name: 'Change logo' }).map((button) =>
|
||||
expect(button).toHaveAttribute('aria-disabled', 'true')
|
||||
);
|
||||
|
||||
getAllByRole('button', { name: 'Reset logo' }).map((button) =>
|
||||
expect(button).toHaveAttribute('aria-disabled', 'true')
|
||||
);
|
||||
});
|
||||
});
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user