1
0
mirror of https://github.com/yldio/copilot.git synced 2024-12-29 05:10:05 +02:00

test(cp-frontend): add more tests

This commit is contained in:
Sara Vieira 2017-09-07 10:25:54 +01:00 committed by Sérgio Ramos
parent d1bc04c528
commit 9df5afc607
50 changed files with 42655 additions and 746 deletions

View File

@ -17,4 +17,4 @@ export const EEditor = ({ input, defaultValue, readOnly }) => (
value={input.value || defaultValue}
readOnly={readOnly}
/>
);
);

View File

@ -80,4 +80,4 @@ export const Environment = ({
);
};
export default Environment;
export default Environment;

View File

@ -3,6 +3,7 @@ import { FormMeta, Button, Label } from 'joyent-ui-toolkit';
import { Row } from 'react-styled-flexboxgrid';
import remcalc from 'remcalc';
import { Field } from 'redux-form';
import { MEditor } from './editors';
const ButtonsRow = Row.extend`margin: ${remcalc(29)} 0 ${remcalc(60)} 0;`;
@ -33,4 +34,4 @@ export const Manifest = ({
</form>
);
export default Manifest;
export default Manifest;

View File

@ -179,7 +179,7 @@ const ServiceListItem = ({
}
const graphs =
!children.length && Object.keys(service.metrics).length
!children.length && service.metrics && Object.keys(service.metrics).length
? Object.keys(service.metrics).map(key => (
<GraphContainer xs={4}>
<GraphLeftShaddow />
@ -229,4 +229,4 @@ ServiceListItem.propTypes = {
service: PropTypes.object.isRequired // Define better
};
export default ServiceListItem;
export default ServiceListItem;

View File

@ -157,4 +157,4 @@ export const withServiceMetricsGql = ({
};
}
});
};
};

View File

@ -66,4 +66,4 @@ export default paths => {
}
};
};
};
};

View File

@ -84,4 +84,4 @@ export default compose(
}
}),
withNotFound([GqlPaths.DEPLOYMENT_GROUP, GqlPaths.SERVICES])
)(ServiceMetrics);
)(ServiceMetrics);

View File

@ -185,4 +185,4 @@ const ServicesTopologyWithData = compose(
withNotFound([GqlPaths.DEPLOYMENT_GROUP])
)(ServicesTopology);
export default ServicesTopologyWithData;
export default ServicesTopologyWithData;

View File

@ -177,7 +177,7 @@ const processServicesForTopology = services => {
// metricsData should prob be an array rather than an object
const processInstancesMetrics = instances =>
forceArray(instances).reduce((metrics, instance) => {
instance.metrics.forEach(instanceMetrics => {
instance.metrics && instance.metrics.forEach(instanceMetrics => {
metrics[instanceMetrics.name] = forceArray(
metrics[instanceMetrics.name]
).concat([instanceMetrics]);
@ -198,4 +198,4 @@ export {
processServices,
processServicesForTopology,
processInstancesMetrics
};
};

View File

@ -52,17 +52,17 @@ exports[`renders <DeploymentGroupDelete /> without throwing 1`] = `
}
.c4::-moz-focus-inner,
.c4[type="button"]::-moz-focus-inner,
.c4[type="reset"]::-moz-focus-inner,
.c4[type="submit"]::-moz-focus-inner {
.c4[type='button']::-moz-focus-inner,
.c4[type='reset']::-moz-focus-inner,
.c4[type='submit']::-moz-focus-inner {
border-style: none;
padding: 0;
}
.c4:-moz-focusring,
.c4[type="button"]:-moz-focusring,
.c4[type="reset"]:-moz-focusring,
.c4[type="submit"]:-moz-focusring {
.c4[type='button']:-moz-focusring,
.c4[type='reset']:-moz-focusring,
.c4[type='submit']:-moz-focusring {
outline: 0.0625rem dotted ButtonText;
}
@ -161,17 +161,17 @@ exports[`renders <DeploymentGroupDelete /> without throwing 1`] = `
}
.c5::-moz-focus-inner,
.c5[type="button"]::-moz-focus-inner,
.c5[type="reset"]::-moz-focus-inner,
.c5[type="submit"]::-moz-focus-inner {
.c5[type='button']::-moz-focus-inner,
.c5[type='reset']::-moz-focus-inner,
.c5[type='submit']::-moz-focus-inner {
border-style: none;
padding: 0;
}
.c5:-moz-focusring,
.c5[type="button"]:-moz-focusring,
.c5[type="reset"]:-moz-focusring,
.c5[type="submit"]:-moz-focusring {
.c5[type='button']:-moz-focusring,
.c5[type='reset']:-moz-focusring,
.c5[type='submit']:-moz-focusring {
outline: 0.0625rem dotted ButtonText;
}
@ -230,7 +230,19 @@ exports[`renders <DeploymentGroupDelete /> without throwing 1`] = `
}
<div>
<h2
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 500;
font-size: 1.5rem;
}
.c0 {
line-height: 1.25;
color: ;
margin: 0 0 0.75rem 0;
}
<h2
className="c0 c1"
>
Deleting a deployment group:
@ -238,19 +250,235 @@ exports[`renders <DeploymentGroupDelete /> without throwing 1`] = `
Wordpress Blog Example
</h2>
<p
className="c2 c3"
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
}
.c0 {
color: ;
margin: 0.75rem 0 1.875rem 0;
}
<p
className="c0 c1"
>
Deleting a deployment group will also remove all of the services and instances associated with that deployment group. Are you sure you want to continue?
</p>
<button
className="c4"
.c0 {
font-family: sans-serif;
font-size: 100%;
line-height: 1.15;
margin: 0;
overflow: visible;
text-transform: none;
-webkit-appearance: button;
-moz-appearance: button;
appearance: button;
min-width: 7.5rem;
box-sizing: border-box;
display: inline-block;
-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;
margin: 0;
padding: 0.9375rem 1.125rem;
position: relative;
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
text-align: center;
font-style: normal;
font-stretch: normal;
line-height: normal;
-webkit-letter-spacing: normal;
-moz-letter-spacing: normal;
-ms-letter-spacing: normal;
letter-spacing: normal;
text-decoration: none;
white-space: nowrap;
vertical-align: middle;
touch-action: manipulation;
cursor: pointer;
color: ;
background-image: none;
background-color: ;
border-radius: 0.25rem;
border: solid 0.0625rem;
color: ;
background-color: ;
border-color: ;
}
.c0::-moz-focus-inner,
.c0[type='button']::-moz-focus-inner,
.c0[type='reset']::-moz-focus-inner,
.c0[type='submit']::-moz-focus-inner {
border-style: none;
padding: 0;
}
.c0:-moz-focusring,
.c0[type='button']:-moz-focusring,
.c0[type='reset']:-moz-focusring,
.c0[type='submit']:-moz-focusring {
outline: 0.0625rem dotted ButtonText;
}
.c0:focus {
outline: 0;
text-decoration: none;
background-color: ;
border-color: ;
}
.c0:hover {
background-color: ;
border: solid 0.0625rem;
}
.c0:active,
.c0:active:hover,
.c0:active:focus {
background-image: none;
outline: 0;
background-color: ;
border-color: ;
}
.c0[disabled] {
cursor: not-allowed;
pointer-events: none;
}
.c0:focus {
background-color: ;
border-color: ;
}
.c0:hover {
background-color: ;
border-color: ;
}
.c0:active,
.c0:active:hover,
.c0:active:focus {
background-color: ;
border-color: ;
}
.c0 + button {
margin-left: 1.25rem;
}
<button
className="c0"
onClick={[Function]}
>
Cancel
</button>
<button
className="c5"
.c0 {
font-family: sans-serif;
font-size: 100%;
line-height: 1.15;
margin: 0;
overflow: visible;
text-transform: none;
-webkit-appearance: button;
-moz-appearance: button;
appearance: button;
min-width: 7.5rem;
box-sizing: border-box;
display: inline-block;
-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;
margin: 0;
padding: 0.9375rem 1.125rem;
position: relative;
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
text-align: center;
font-style: normal;
font-stretch: normal;
line-height: normal;
-webkit-letter-spacing: normal;
-moz-letter-spacing: normal;
-ms-letter-spacing: normal;
letter-spacing: normal;
text-decoration: none;
white-space: nowrap;
vertical-align: middle;
touch-action: manipulation;
cursor: pointer;
color: ;
background-image: none;
background-color: ;
border-radius: 0.25rem;
border: solid 0.0625rem;
}
.c0::-moz-focus-inner,
.c0[type='button']::-moz-focus-inner,
.c0[type='reset']::-moz-focus-inner,
.c0[type='submit']::-moz-focus-inner {
border-style: none;
padding: 0;
}
.c0:-moz-focusring,
.c0[type='button']:-moz-focusring,
.c0[type='reset']:-moz-focusring,
.c0[type='submit']:-moz-focusring {
outline: 0.0625rem dotted ButtonText;
}
.c0:focus {
outline: 0;
text-decoration: none;
background-color: ;
border-color: ;
}
.c0:hover {
background-color: ;
border: solid 0.0625rem;
}
.c0:active,
.c0:active:hover,
.c0:active:focus {
background-image: none;
outline: 0;
background-color: ;
border-color: ;
}
.c0[disabled] {
cursor: not-allowed;
pointer-events: none;
}
.c0 + button {
margin-left: 1.25rem;
}
<button
className="c0"
onClick={[Function]}
>
Delete deployment group

View File

@ -49,11 +49,44 @@ exports[`renders <EmtpyInstances /> without throwing 1`] = `
<div
className="c0"
>
<div
className="c1"
.c0 {
box-sizing: border-box;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
padding-right: 0.5rem;
padding-left: 0.5rem;
}
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
}
@media only screen and (min-width:0em) {
.c0 {
-webkit-flex-basis: 100%;
-ms-flex-basis: 100%;
flex-basis: 100%;
max-width: 100%;
display: block;
}
}
<div
className="c0"
>
<p
className="c2"
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
}
<p
className="c0"
>
You don't have any instances
</p>

View File

@ -1,16 +1,19 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders <InstanceCard /> without throwing 1`] = `
.c10 {
.c12 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
}
.c8 {
.c9 {
-webkit-fill: ;
fill: ;
}
@ -80,6 +83,8 @@ exports[`renders <InstanceCard /> without throwing 1`] = `
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
height: 100%;
position: relative;
}
.c1 {
@ -146,26 +151,50 @@ exports[`renders <InstanceCard /> without throwing 1`] = `
flex-direction: row;
}
.c9 {
.c10 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
display: inline-block;
margin-left: 1.5rem;
}
.c9::first-letter {
.c10::first-letter {
text-transform: capitalize;
}
.c7 {
.c8 {
position: absolute;
}
.c11 {
.c7 {
height: 100%;
float: right;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
}
.c13 {
margin-right: 0.375rem;
width: 0.375rem;
height: 0.375rem;
@ -187,92 +216,825 @@ exports[`renders <InstanceCard /> without throwing 1`] = `
border-bottom-width: 0;
}
.c11 {
height: 100%;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
}
<div
className="c0 c1"
name="card"
>
<div
className="c2"
.c10 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
}
.c7 {
-webkit-fill: ;
fill: ;
}
.c1 {
font-size: 0.9375rem;
line-height: 1.5;
color: ;
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 600;
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: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-flex-grow: 2;
-ms-flex-grow: 2;
flex-grow: 2;
-webkit-flex-basis: 5.625rem;
-ms-flex-basis: 5.625rem;
flex-basis: 5.625rem;
width: 100%;
padding: 0.75rem 1.125rem 0 1.125rem;
-webkit-flex-grow: 6;
-ms-flex-grow: 6;
flex-grow: 6;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
width: auto;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
padding: 0 1.125rem;
}
.c2 {
display: inline-block;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
.c3 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-flex-grow: 1;
-ms-flex-grow: 1;
flex-grow: 1;
-webkit-flex-basis: 5.625rem;
-ms-flex-basis: 5.625rem;
flex-basis: 5.625rem;
}
.c4 {
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
height: 100%;
position: relative;
}
.c0 {
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex: 0 1 auto;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -0.5rem;
margin-left: -0.5rem;
-webkit-flex: 1;
-ms-flex: 1;
flex: 1;
margin: 0;
height: auto;
padding-top: 0;
min-width: auto;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
}
.c8 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
display: inline-block;
margin-left: 1.5rem;
}
.c8::first-letter {
text-transform: capitalize;
}
.c6 {
position: absolute;
}
.c5 {
height: 100%;
float: right;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
}
.c11 {
margin-right: 0.375rem;
width: 0.375rem;
height: 0.375rem;
border-radius: 0.1875rem;
display: inline-block;
background-color: ;
}
.c9 {
height: 100%;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
}
<div
className="c0"
name="card-view"
>
<div
className="c3"
.c0 {
font-size: 0.9375rem;
line-height: 1.5;
color: ;
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 600;
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: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-flex-grow: 2;
-ms-flex-grow: 2;
flex-grow: 2;
-webkit-flex-basis: 5.625rem;
-ms-flex-basis: 5.625rem;
flex-basis: 5.625rem;
width: 100%;
padding: 0.75rem 1.125rem 0 1.125rem;
-webkit-flex-grow: 6;
-ms-flex-grow: 6;
flex-grow: 6;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
width: auto;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
padding: 0 1.125rem;
}
.c1 {
display: inline-block;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
<div
className="c0"
name="container"
>
<span
className="c4"
.c0 {
display: inline-block;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
}
<span
className="c0"
>
wordpress_01
</span>
</div>
<div
className="c5 c3"
.c5 {
-webkit-fill: ;
fill: ;
}
.c1 {
font-size: 0.9375rem;
line-height: 1.5;
color: ;
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 600;
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: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-flex-grow: 2;
-ms-flex-grow: 2;
flex-grow: 2;
-webkit-flex-basis: 5.625rem;
-ms-flex-basis: 5.625rem;
flex-basis: 5.625rem;
width: 100%;
padding: 0.75rem 1.125rem 0 1.125rem;
-webkit-flex-grow: 6;
-ms-flex-grow: 6;
flex-grow: 6;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
width: auto;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
padding: 0 1.125rem;
}
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-flex-grow: 1;
-ms-flex-grow: 1;
flex-grow: 1;
-webkit-flex-basis: 5.625rem;
-ms-flex-basis: 5.625rem;
flex-basis: 5.625rem;
}
.c2 {
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
height: 100%;
position: relative;
}
.c6 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
display: inline-block;
margin-left: 1.5rem;
}
.c6::first-letter {
text-transform: capitalize;
}
.c4 {
position: absolute;
}
.c3 {
height: 100%;
float: right;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
}
<div
className="c0 c1"
name="container"
>
<div
className="c6"
.c3 {
-webkit-fill: ;
fill: ;
}
.c0 {
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
height: 100%;
position: relative;
}
.c4 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
display: inline-block;
margin-left: 1.5rem;
}
.c4::first-letter {
text-transform: capitalize;
}
.c2 {
position: absolute;
}
.c1 {
height: 100%;
float: right;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
}
<div
className="c0"
>
<div
.c2 {
-webkit-fill: ;
fill: ;
}
.c3 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
display: inline-block;
margin-left: 1.5rem;
}
.c3::first-letter {
text-transform: capitalize;
}
.c1 {
position: absolute;
}
.c0 {
height: 100%;
float: right;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
}
<div
className="c0"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<div>
<div
className="c7"
color="dark"
.c1 {
-webkit-fill: ;
fill: ;
}
.c0 {
position: absolute;
}
<div
className="c0"
color="dark"
>
.c0 {
-webkit-fill: ;
fill: ;
}
<svg
className="c0"
healthy="HEALTHY"
height="18"
viewBox="0 0 18 18"
width="18"
xmlns="http://www.w3.org/2000/svg"
>
<svg
className="c8"
healthy="HEALTHY"
height="18"
viewBox="0 0 18 18"
width="18"
xmlns="http://www.w3.org/2000/svg"
<title>
icon: state
</title>
<g
fillRule="evenodd"
>
<title>
icon: state
</title>
<g
fillRule="evenodd"
>
<circle
cx="9"
cy="9"
r="9"
/>
<path
d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
fill="#FFF"
/>
</g>
</svg>
</div>
<label
className="c9"
color="dark"
>
healthy
</label>
<circle
cx="9"
cy="9"
r="9"
/>
<path
d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
fill="#FFF"
/>
</g>
</svg>
</div>
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
display: inline-block;
margin-left: 1.5rem;
}
.c0::first-letter {
text-transform: capitalize;
}
<label
className="c0"
color="dark"
>
healthy
</label>
</div>
</div>
</div>
<div
className="c5 c3"
.c4 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
}
.c1 {
font-size: 0.9375rem;
line-height: 1.5;
color: ;
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 600;
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: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-flex-grow: 2;
-ms-flex-grow: 2;
flex-grow: 2;
-webkit-flex-basis: 5.625rem;
-ms-flex-basis: 5.625rem;
flex-basis: 5.625rem;
width: 100%;
padding: 0.75rem 1.125rem 0 1.125rem;
-webkit-flex-grow: 6;
-ms-flex-grow: 6;
flex-grow: 6;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
width: auto;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
padding: 0 1.125rem;
}
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-flex-grow: 1;
-ms-flex-grow: 1;
flex-grow: 1;
-webkit-flex-basis: 5.625rem;
-ms-flex-basis: 5.625rem;
flex-basis: 5.625rem;
}
.c2 {
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
height: 100%;
position: relative;
}
.c5 {
margin-right: 0.375rem;
width: 0.375rem;
height: 0.375rem;
border-radius: 0.1875rem;
display: inline-block;
background-color: ;
}
.c3 {
height: 100%;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
}
<div
className="c0 c1"
name="container"
>
<div
className="c6"
.c2 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
}
.c0 {
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
height: 100%;
position: relative;
}
.c3 {
margin-right: 0.375rem;
width: 0.375rem;
height: 0.375rem;
border-radius: 0.1875rem;
display: inline-block;
background-color: ;
}
.c1 {
height: 100%;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
}
<div
className="c0"
>
<div
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
}
.c2 {
margin-right: 0.375rem;
width: 0.375rem;
height: 0.375rem;
border-radius: 0.1875rem;
display: inline-block;
background-color: ;
}
.c0 {
height: 100%;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
}
<div
className="c0"
onMouseOut={[Function]}
onMouseOver={[Function]}
>
<label
className="c10"
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
}
.c1 {
margin-right: 0.375rem;
width: 0.375rem;
height: 0.375rem;
border-radius: 0.1875rem;
display: inline-block;
background-color: ;
}
<label
className="c0"
>
<span
className="c11"
.c0 {
margin-right: 0.375rem;
width: 0.375rem;
height: 0.375rem;
border-radius: 0.1875rem;
display: inline-block;
background-color: ;
}
<span
className="c0"
/>
Running
</label>

View File

@ -0,0 +1,729 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders <EEditor /> without throwing 1`] = `
.c1 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
.c2 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
.c3 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
.c0 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-flex: 1 0 auto;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
}
.c4 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
text-align: center;
margin-bottom: 0;
}
<div
className="c0"
>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
.c1 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
.c2 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
<svg
height="10"
width="28"
>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
<rect
className="c0"
height="6"
width="6"
x="2"
y="2"
/>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
<rect
className="c0"
height="6"
width="6"
x="11"
y="2"
/>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
<rect
className="c0"
height="6"
width="6"
x="20"
y="2"
/>
</svg>
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
text-align: center;
margin-bottom: 0;
}
<p
className="c0"
>
Loading...
</p>
</div>
`;
exports[`renders <EEditor /> without throwing 2`] = `
.c1 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
.c2 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
.c3 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
.c0 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-flex: 1 0 auto;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
}
.c4 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
text-align: center;
margin-bottom: 0;
}
<div
className="c0"
>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
.c1 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
.c2 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
<svg
height="10"
width="28"
>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
<rect
className="c0"
height="6"
width="6"
x="2"
y="2"
/>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
<rect
className="c0"
height="6"
width="6"
x="11"
y="2"
/>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
<rect
className="c0"
height="6"
width="6"
x="20"
y="2"
/>
</svg>
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
text-align: center;
margin-bottom: 0;
}
<p
className="c0"
>
Loading...
</p>
</div>
`;
exports[`renders <MEditor /> without throwing 1`] = `
.c1 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
.c2 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
.c3 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
.c0 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-flex: 1 0 auto;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
}
.c4 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
text-align: center;
margin-bottom: 0;
}
<div
className="c0"
>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
.c1 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
.c2 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
<svg
height="10"
width="28"
>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
<rect
className="c0"
height="6"
width="6"
x="2"
y="2"
/>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
<rect
className="c0"
height="6"
width="6"
x="11"
y="2"
/>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
<rect
className="c0"
height="6"
width="6"
x="20"
y="2"
/>
</svg>
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
text-align: center;
margin-bottom: 0;
}
<p
className="c0"
>
Loading...
</p>
</div>
`;
exports[`renders <MEditor /> without throwing 2`] = `
.c1 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
.c2 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
.c3 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
.c0 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-flex: 1 0 auto;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
}
.c4 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
text-align: center;
margin-bottom: 0;
}
<div
className="c0"
>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
.c1 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
.c2 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
<svg
height="10"
width="28"
>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
<rect
className="c0"
height="6"
width="6"
x="2"
y="2"
/>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
<rect
className="c0"
height="6"
width="6"
x="11"
y="2"
/>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
<rect
className="c0"
height="6"
width="6"
x="20"
y="2"
/>
</svg>
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
text-align: center;
margin-bottom: 0;
}
<p
className="c0"
>
Loading...
</p>
</div>
`;

View File

@ -0,0 +1,835 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders <Files /> without throwing 1`] = `
.c7 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
.c8 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
.c9 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
.c2 {
padding: 0.35em 0.75em 0.625em;
display: inline-block;
margin: 0;
padding: 0;
border: none;
overflow: hidden;
width: 100%;
height: auto;
-webkit-margin-start: 0;
-webkit-margin-end: 0;
-webkit-padding-before: 0;
-webkit-padding-start: 0;
-webkit-padding-end: 0;
-webkit-padding-after: 0;
}
.c5 {
box-sizing: border-box;
width: 100%;
height: 3rem;
margin-bottom: 0.5rem;
margin-top: 0.5rem;
padding: 0.8125rem 1.125rem;
border-radius: 0.25rem;
background-color: ;
border: 0.0625rem solid;
font-size: 0.9375rem;
line-height: normal !important;
font-weight: 400;
font-style: normal;
font-stretch: normal;
color: ;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
outline: 0;
}
.c5:focus {
border-color: ;
outline: 0;
}
.c1 {
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex: 0 1 auto;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -0.5rem;
margin-left: -0.5rem;
position: relative;
height: auto;
min-height: 7.875rem;
margin-bottom: 0.625rem;
border: 0.0625rem solid;
background-color: ;
box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
margin-right: 0rem;
margin-left: 0rem;
}
.c6 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-flex: 1 0 auto;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
}
.c10 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
text-align: center;
margin-bottom: 0;
}
.c3 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: space-between;
-webkit-justify-content: space-between;
-ms-flex-pack: space-between;
justify-content: space-between;
-webkit-align-content: stretch;
-ms-flex-line-pack: stretch;
align-content: stretch;
-webkit-align-items: stretch;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.c4 {
-webkit-order: 0;
-ms-flex-order: 0;
order: 0;
-webkit-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
margin: 0 0 0.8125rem 0;
}
.c0 {
padding: 1.5rem 1.1875rem;
}
<div>
.c7 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
.c8 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
.c9 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
.c2 {
padding: 0.35em 0.75em 0.625em;
display: inline-block;
margin: 0;
padding: 0;
border: none;
overflow: hidden;
width: 100%;
height: auto;
-webkit-margin-start: 0;
-webkit-margin-end: 0;
-webkit-padding-before: 0;
-webkit-padding-start: 0;
-webkit-padding-end: 0;
-webkit-padding-after: 0;
}
.c5 {
box-sizing: border-box;
width: 100%;
height: 3rem;
margin-bottom: 0.5rem;
margin-top: 0.5rem;
padding: 0.8125rem 1.125rem;
border-radius: 0.25rem;
background-color: ;
border: 0.0625rem solid;
font-size: 0.9375rem;
line-height: normal !important;
font-weight: 400;
font-style: normal;
font-stretch: normal;
color: ;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
outline: 0;
}
.c5:focus {
border-color: ;
outline: 0;
}
.c1 {
box-sizing: border-box;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex: 0 1 auto;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: wrap;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -0.5rem;
margin-left: -0.5rem;
position: relative;
height: auto;
min-height: 7.875rem;
margin-bottom: 0.625rem;
border: 0.0625rem solid;
background-color: ;
box-shadow: 0 0.125rem 0 0 rgba(0,0,0,0.05);
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
margin-right: 0rem;
margin-left: 0rem;
}
.c6 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-flex: 1 0 auto;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
}
.c10 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
text-align: center;
margin-bottom: 0;
}
.c3 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: space-between;
-webkit-justify-content: space-between;
-ms-flex-pack: space-between;
justify-content: space-between;
-webkit-align-content: stretch;
-ms-flex-line-pack: stretch;
align-content: stretch;
-webkit-align-items: stretch;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.c4 {
-webkit-order: 0;
-ms-flex-order: 0;
order: 0;
-webkit-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
margin: 0 0 0.8125rem 0;
}
.c0 {
padding: 1.5rem 1.1875rem;
}
<div
className="c0 c1"
name="card"
>
.c0 {
padding: 0.35em 0.75em 0.625em;
display: inline-block;
margin: 0;
padding: 0;
border: none;
overflow: hidden;
width: 100%;
height: auto;
-webkit-margin-start: 0;
-webkit-margin-end: 0;
-webkit-padding-before: 0;
-webkit-padding-start: 0;
-webkit-padding-end: 0;
-webkit-padding-after: 0;
}
.c3 {
box-sizing: border-box;
width: 100%;
height: 3rem;
margin-bottom: 0.5rem;
margin-top: 0.5rem;
padding: 0.8125rem 1.125rem;
border-radius: 0.25rem;
background-color: ;
border: 0.0625rem solid;
font-size: 0.9375rem;
line-height: normal !important;
font-weight: 400;
font-style: normal;
font-stretch: normal;
color: ;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
outline: 0;
}
.c3:focus {
border-color: ;
outline: 0;
}
.c1 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: space-between;
-webkit-justify-content: space-between;
-ms-flex-pack: space-between;
justify-content: space-between;
-webkit-align-content: stretch;
-ms-flex-line-pack: stretch;
align-content: stretch;
-webkit-align-items: stretch;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.c2 {
-webkit-order: 0;
-ms-flex-order: 0;
order: 0;
-webkit-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
margin: 0 0 0.8125rem 0;
}
<fieldset
className="c0"
style={undefined}
>
.c2 {
box-sizing: border-box;
width: 100%;
height: 3rem;
margin-bottom: 0.5rem;
margin-top: 0.5rem;
padding: 0.8125rem 1.125rem;
border-radius: 0.25rem;
background-color: ;
border: 0.0625rem solid;
font-size: 0.9375rem;
line-height: normal !important;
font-weight: 400;
font-style: normal;
font-stretch: normal;
color: ;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
outline: 0;
}
.c2:focus {
border-color: ;
outline: 0;
}
.c0 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: space-between;
-webkit-justify-content: space-between;
-ms-flex-pack: space-between;
justify-content: space-between;
-webkit-align-content: stretch;
-ms-flex-line-pack: stretch;
align-content: stretch;
-webkit-align-items: stretch;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.c1 {
-webkit-order: 0;
-ms-flex-order: 0;
order: 0;
-webkit-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
margin: 0 0 0.8125rem 0;
}
<div>
.c2 {
box-sizing: border-box;
width: 100%;
height: 3rem;
margin-bottom: 0.5rem;
margin-top: 0.5rem;
padding: 0.8125rem 1.125rem;
border-radius: 0.25rem;
background-color: ;
border: 0.0625rem solid;
font-size: 0.9375rem;
line-height: normal !important;
font-weight: 400;
font-style: normal;
font-stretch: normal;
color: ;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
outline: 0;
}
.c2:focus {
border-color: ;
outline: 0;
}
.c0 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: row;
-ms-flex-direction: row;
flex-direction: row;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: space-between;
-webkit-justify-content: space-between;
-ms-flex-pack: space-between;
justify-content: space-between;
-webkit-align-content: stretch;
-ms-flex-line-pack: stretch;
align-content: stretch;
-webkit-align-items: stretch;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.c1 {
-webkit-order: 0;
-ms-flex-order: 0;
order: 0;
-webkit-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
margin: 0 0 0.8125rem 0;
}
<span
className="c0"
>
.c1 {
box-sizing: border-box;
width: 100%;
height: 3rem;
margin-bottom: 0.5rem;
margin-top: 0.5rem;
padding: 0.8125rem 1.125rem;
border-radius: 0.25rem;
background-color: ;
border: 0.0625rem solid;
font-size: 0.9375rem;
line-height: normal !important;
font-weight: 400;
font-style: normal;
font-stretch: normal;
color: ;
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
outline: 0;
}
.c1:focus {
border-color: ;
outline: 0;
}
.c0 {
-webkit-order: 0;
-ms-flex-order: 0;
order: 0;
-webkit-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
margin: 0 0 0.8125rem 0;
}
<input
className="c0 c1"
id="ceBOoS"
placeholder="Filename including extension…"
type="text"
value={undefined}
/>
</span>
</div>
</fieldset>
.c1 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
.c2 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
.c3 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
.c0 {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-direction: column;
-ms-flex-direction: column;
flex-direction: column;
-webkit-flex-wrap: nowrap;
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-align-content: center;
-ms-flex-line-pack: center;
align-content: center;
-webkit-align-items: center;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-flex: 1 0 auto;
-ms-flex: 1 0 auto;
flex: 1 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
}
.c4 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
text-align: center;
margin-bottom: 0;
}
<div
className="c0"
>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
.c1 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
.c2 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
<svg
height="10"
width="28"
>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
<rect
className="c0"
height="6"
width="6"
x="2"
y="2"
/>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
<rect
className="c0"
height="6"
width="6"
x="11"
y="2"
/>
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
<rect
className="c0"
height="6"
width="6"
x="20"
y="2"
/>
</svg>
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
text-align: center;
margin-bottom: 0;
}
<p
className="c0"
>
Loading...
</p>
</div>
</div>
</div>
`;

View File

@ -0,0 +1,334 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders <Manifest /> without throwing 1`] = `
<ApolloProvider
client={
ApolloClient {
"addTypename": true,
"dataId": [Function],
"dataIdFromObject": [Function],
"disableNetworkFetches": false,
"fieldWithArgs": [Function],
"fragmentMatcher": HeuristicFragmentMatcher {},
"initialState": Object {},
"middleware": [Function],
"mutate": [Function],
"networkInterface": HTTPFetchNetworkInterface {
"_afterwares": Array [],
"_middlewares": Array [],
"_opts": Object {},
"_uri": "https://localhost:443/api/graphql",
},
"query": [Function],
"queryDeduplication": true,
"queryManager": QueryManager {
"addTypename": true,
"deduplicator": Deduplicator {
"inFlightRequestPromises": Object {},
"networkInterface": HTTPFetchNetworkInterface {
"_afterwares": Array [],
"_middlewares": Array [],
"_opts": Object {},
"_uri": "https://localhost:443/api/graphql",
},
},
"disableBroadcasting": false,
"fetchQueryPromises": Object {},
"fragmentMatcher": HeuristicFragmentMatcher {},
"idCounter": 1,
"lastRequestId": Object {},
"mutationStore": MutationStore {
"store": Object {},
},
"networkInterface": HTTPFetchNetworkInterface {
"_afterwares": Array [],
"_middlewares": Array [],
"_opts": Object {},
"_uri": "https://localhost:443/api/graphql",
},
"observableQueries": Object {},
"pollingTimers": Object {},
"queryDeduplication": true,
"queryDocuments": Object {},
"queryIdsByName": Object {},
"queryListeners": Object {},
"queryStore": QueryStore {
"store": Object {},
},
"reducerConfig": Object {
"addTypename": true,
"customResolvers": undefined,
"dataIdFromObject": [Function],
"fragmentMatcher": [Function],
},
"reduxRootSelector": [Function],
"scheduler": QueryScheduler {
"inFlightQueries": Object {},
"intervalQueries": Object {},
"pollingTimers": Object {},
"queryManager": [Circular],
"registeredQueries": Object {},
},
"ssrMode": false,
"store": Object {
"dispatch": [Function],
"getState": [Function],
},
},
"reducerConfig": Object {
"addTypename": true,
"customResolvers": undefined,
"dataIdFromObject": [Function],
"fragmentMatcher": [Function],
},
"resetStore": [Function],
"setStore": [Function],
"ssrMode": false,
"store": Object {
"dispatch": [Function],
"getState": [Function],
},
"version": "1.9.2",
"watchQuery": [Function],
}
}
store={
Object {
"dispatch": [Function],
"getState": [Function],
"replaceReducer": [Function],
"subscribe": [Function],
Symbol(observable): [Function],
}
}
>
<ReduxForm
defaultValue="test"
dirty={true}
handleSubmit={[Function]}
loading={true}
onCancel={[Function]}
/>
</ApolloProvider>
`;
exports[`renders <Manifest /> without throwing 2`] = `
<ApolloProvider
client={
ApolloClient {
"addTypename": true,
"dataId": [Function],
"dataIdFromObject": [Function],
"disableNetworkFetches": false,
"fieldWithArgs": [Function],
"fragmentMatcher": HeuristicFragmentMatcher {},
"initialState": Object {},
"middleware": [Function],
"mutate": [Function],
"networkInterface": HTTPFetchNetworkInterface {
"_afterwares": Array [],
"_middlewares": Array [],
"_opts": Object {},
"_uri": "https://localhost:443/api/graphql",
},
"query": [Function],
"queryDeduplication": true,
"queryManager": QueryManager {
"addTypename": true,
"deduplicator": Deduplicator {
"inFlightRequestPromises": Object {},
"networkInterface": HTTPFetchNetworkInterface {
"_afterwares": Array [],
"_middlewares": Array [],
"_opts": Object {},
"_uri": "https://localhost:443/api/graphql",
},
},
"disableBroadcasting": false,
"fetchQueryPromises": Object {},
"fragmentMatcher": HeuristicFragmentMatcher {},
"idCounter": 1,
"lastRequestId": Object {},
"mutationStore": MutationStore {
"store": Object {},
},
"networkInterface": HTTPFetchNetworkInterface {
"_afterwares": Array [],
"_middlewares": Array [],
"_opts": Object {},
"_uri": "https://localhost:443/api/graphql",
},
"observableQueries": Object {},
"pollingTimers": Object {},
"queryDeduplication": true,
"queryDocuments": Object {},
"queryIdsByName": Object {},
"queryListeners": Object {},
"queryStore": QueryStore {
"store": Object {},
},
"reducerConfig": Object {
"addTypename": true,
"customResolvers": undefined,
"dataIdFromObject": [Function],
"fragmentMatcher": [Function],
},
"reduxRootSelector": [Function],
"scheduler": QueryScheduler {
"inFlightQueries": Object {},
"intervalQueries": Object {},
"pollingTimers": Object {},
"queryManager": [Circular],
"registeredQueries": Object {},
},
"ssrMode": false,
"store": Object {
"dispatch": [Function],
"getState": [Function],
},
},
"reducerConfig": Object {
"addTypename": true,
"customResolvers": undefined,
"dataIdFromObject": [Function],
"fragmentMatcher": [Function],
},
"resetStore": [Function],
"setStore": [Function],
"ssrMode": false,
"store": Object {
"dispatch": [Function],
"getState": [Function],
},
"version": "1.9.2",
"watchQuery": [Function],
}
}
store={
Object {
"dispatch": [Function],
"getState": [Function],
"replaceReducer": [Function],
"subscribe": [Function],
Symbol(observable): [Function],
}
}
>
<ReduxForm
defaultValue="test"
handleSubmit={[Function]}
loading={true}
onCancel={[Function]}
/>
</ApolloProvider>
`;
exports[`renders <Manifest /> without throwing 3`] = `
<ApolloProvider
client={
ApolloClient {
"addTypename": true,
"dataId": [Function],
"dataIdFromObject": [Function],
"disableNetworkFetches": false,
"fieldWithArgs": [Function],
"fragmentMatcher": HeuristicFragmentMatcher {},
"initialState": Object {},
"middleware": [Function],
"mutate": [Function],
"networkInterface": HTTPFetchNetworkInterface {
"_afterwares": Array [],
"_middlewares": Array [],
"_opts": Object {},
"_uri": "https://localhost:443/api/graphql",
},
"query": [Function],
"queryDeduplication": true,
"queryManager": QueryManager {
"addTypename": true,
"deduplicator": Deduplicator {
"inFlightRequestPromises": Object {},
"networkInterface": HTTPFetchNetworkInterface {
"_afterwares": Array [],
"_middlewares": Array [],
"_opts": Object {},
"_uri": "https://localhost:443/api/graphql",
},
},
"disableBroadcasting": false,
"fetchQueryPromises": Object {},
"fragmentMatcher": HeuristicFragmentMatcher {},
"idCounter": 1,
"lastRequestId": Object {},
"mutationStore": MutationStore {
"store": Object {},
},
"networkInterface": HTTPFetchNetworkInterface {
"_afterwares": Array [],
"_middlewares": Array [],
"_opts": Object {},
"_uri": "https://localhost:443/api/graphql",
},
"observableQueries": Object {},
"pollingTimers": Object {},
"queryDeduplication": true,
"queryDocuments": Object {},
"queryIdsByName": Object {},
"queryListeners": Object {},
"queryStore": QueryStore {
"store": Object {},
},
"reducerConfig": Object {
"addTypename": true,
"customResolvers": undefined,
"dataIdFromObject": [Function],
"fragmentMatcher": [Function],
},
"reduxRootSelector": [Function],
"scheduler": QueryScheduler {
"inFlightQueries": Object {},
"intervalQueries": Object {},
"pollingTimers": Object {},
"queryManager": [Circular],
"registeredQueries": Object {},
},
"ssrMode": false,
"store": Object {
"dispatch": [Function],
"getState": [Function],
},
},
"reducerConfig": Object {
"addTypename": true,
"customResolvers": undefined,
"dataIdFromObject": [Function],
"fragmentMatcher": [Function],
},
"resetStore": [Function],
"setStore": [Function],
"ssrMode": false,
"store": Object {
"dispatch": [Function],
"getState": [Function],
},
"version": "1.9.2",
"watchQuery": [Function],
}
}
store={
Object {
"dispatch": [Function],
"getState": [Function],
"replaceReducer": [Function],
"subscribe": [Function],
Symbol(observable): [Function],
}
}
>
<ReduxForm
defaultValue="test"
handleSubmit={[Function]}
onCancel={[Function]}
/>
</ApolloProvider>
`;

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,54 @@
/**
* @jest-environment jsdom
*/
import React from 'react';
import renderer from 'react-test-renderer';
import 'jest-styled-components';
import { Store } from '../../mocks';
import { MEditor, EEditor } from '@components/manifest/editors';
it('renders <MEditor /> without throwing', () => {
const tree = renderer
.create(
<Store>
<MEditor input="" defaultValue="" readOnly />
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});
it('renders <MEditor /> without throwing', () => {
const tree = renderer
.create(
<Store>
<MEditor input="" defaultValue="" />
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});
it('renders <EEditor /> without throwing', () => {
const tree = renderer
.create(
<Store>
<EEditor input="" defaultValue="" readOnly />
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});
it('renders <EEditor /> without throwing', () => {
const tree = renderer
.create(
<Store>
<EEditor input="" defaultValue="" />
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});

View File

@ -0,0 +1,52 @@
/**
* @jest-environment jsdom
*/
import React from 'react';
import renderer from 'react-test-renderer';
import 'jest-styled-components';
import { Store, files } from '../../mocks';
import { reduxForm } from 'redux-form';
import { Environment } from '@components/manifest';
const TestEnvironmentForm = reduxForm({ form: 'testNameForm' })(Environment);
it('renders <TestEnvironmentForm /> without throwing', () => {
const tree = renderer
.create(
<Store>
<TestEnvironmentForm
handleSubmit={() => {}}
onCancel={() => {}}
onAddFile={() => {}}
onRemoveFile={() => {}}
dirty
defaultValue=""
files={files}
loading
/>
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});
it('renders <TestEnvironmentForm /> without throwing', () => {
const tree = renderer
.create(
<Store>
<TestEnvironmentForm
handleSubmit={() => {}}
onCancel={() => {}}
onAddFile={() => {}}
onRemoveFile={() => {}}
dirty
files={[]}
readOnly
loading
/>
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});

View File

@ -0,0 +1,29 @@
/**
* @jest-environment jsdom
*/
import React from 'react';
import renderer from 'react-test-renderer';
import 'jest-styled-components';
import { Store, files } from '../../mocks';
import { Files } from '@components/manifest';
it('renders <Files /> without throwing', () => {
const tree = renderer
.create(
<Store>
<Files
files={files}
id="test"
name="test"
value="test"
onRemoveFile={() => {}}
readOnly
/>
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});

View File

@ -0,0 +1,61 @@
/**
* @jest-environment jsdom
*/
import React from 'react';
import ShallowRenderer from 'react-test-renderer/shallow';
import 'jest-styled-components';
import { Store } from '../../mocks';
import { reduxForm } from 'redux-form';
import { Manifest } from '@components/manifest';
const ManifestTestForm = reduxForm({ form: 'ManifestTestForm' })(Manifest);
it('renders <Manifest /> without throwing', () => {
const renderer = new ShallowRenderer();
renderer.render(
<Store>
<ManifestTestForm
defaultValue="test"
handleSubmit={() => {}}
onCancel={() => {}}
dirty
loading
/>
</Store>
);
const tree = renderer.getRenderOutput();
expect(tree).toMatchSnapshot();
});
it('renders <Manifest /> without throwing', () => {
const renderer = new ShallowRenderer();
renderer.render(
<Store>
<ManifestTestForm
defaultValue="test"
handleSubmit={() => {}}
onCancel={() => {}}
loading
/>
</Store>
)
const tree = renderer.getRenderOutput();
expect(tree).toMatchSnapshot();
});
it('renders <Manifest /> without throwing', () => {
const renderer = new ShallowRenderer();
renderer.render(
<Store>
<ManifestTestForm
defaultValue="test"
handleSubmit={() => {}}
onCancel={() => {}}
/>
</Store>
)
const tree = renderer.getRenderOutput();
expect(tree).toMatchSnapshot();
});

View File

@ -0,0 +1,35 @@
/**
* @jest-environment jsdom
*/
import React from 'react';
import renderer from 'react-test-renderer';
import 'jest-styled-components';
import { Store } from '../../mocks';
import { reduxForm } from 'redux-form';
import { Name } from '@components/manifest';
const TestNameForm = reduxForm({ form: 'testNameForm' })(Name);
it('renders <Name /> without throwing', () => {
const tree = renderer
.create(
<Store>
<TestNameForm handleSubmit={() => {}} onCancel={() => {}} dirty />
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});
it('renders <Name /> without throwing', () => {
const tree = renderer
.create(
<Store>
<TestNameForm handleSubmit={() => {}} onCancel={() => {}} />
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});

View File

@ -0,0 +1,98 @@
/**
* @jest-environment jsdom
*/
import React from 'react';
import renderer from 'react-test-renderer';
import 'jest-styled-components';
import { Store } from '../../mocks';
import { Progress } from '@components/manifest';
it('renders <Progress /> without throwing', () => {
const tree = renderer
.create(
<Store>
<Progress stage="name" create />
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});
it('renders <Progress /> without throwing', () => {
const tree = renderer
.create(
<Store>
<Progress stage="name" edit />
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});
it('renders <Progress /> without throwing', () => {
const tree = renderer
.create(
<Store>
<Progress stage="manifest" create />
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});
it('renders <Progress /> without throwing', () => {
const tree = renderer
.create(
<Store>
<Progress stage="environment" create />
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});
it('renders <Progress /> without throwing', () => {
const tree = renderer
.create(
<Store>
<Progress stage="review" create />
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});
it('renders <Progress /> without throwing', () => {
const tree = renderer
.create(
<Store>
<Progress stage="manifest" edit />
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});
it('renders <Progress /> without throwing', () => {
const tree = renderer
.create(
<Store>
<Progress stage="environment" edit />
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});
it('renders <Progress /> without throwing', () => {
const tree = renderer
.create(
<Store>
<Progress stage="review" edit />
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});

View File

@ -0,0 +1,64 @@
/**
* @jest-environment jsdom
*/
import React from 'react';
import renderer from 'react-test-renderer';
import 'jest-styled-components';
import { Store, services } from '../../mocks';
import { Review } from '@components/manifest';
it('renders <Review /> without throwing', () => {
const tree = renderer
.create(
<Store>
<Review
handleSubmit={() => {}}
onEnvironmentToggle={() => {}}
onCancel={() => {}}
dirty
loading
environmentToggles={{ name: test }}
state={{ services }}
/>
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});
it('renders <Review /> without throwing', () => {
const tree = renderer
.create(
<Store>
<Review
handleSubmit={() => {}}
onEnvironmentToggle={() => {}}
onCancel={() => {}}
dirty
environmentToggles={{ name: test }}
state={{ services }}
/>
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});
it('renders <Review /> without throwing', () => {
const tree = renderer
.create(
<Store>
<Review
handleSubmit={() => {}}
onEnvironmentToggle={() => {}}
onCancel={() => {}}
environmentToggles={{ name: test }}
state={{ services }}
/>
</Store>
)
.toJSON();
expect(tree).toMatchSnapshot();
});

View File

@ -36,15 +36,50 @@ exports[`renders <Error /> without throwing 1`] = `
<div
className="c0"
>
<div
className="c1"
.c0 {
position: absolute;
top: 0;
left: 0;
width: 2.25rem;
height: 100%;
background-color: ;
}
<div
className="c0"
type="ERROR"
/>
<div
className="c2"
.c2 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
}
.c0 {
padding: 0.75rem 0 0.84375rem 0;
}
.c1 {
margin: 0.09375rem 3.375rem 0 3.375rem;
}
<div
className="c0"
>
<p
className="c3 c4"
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
}
.c0 {
margin: 0.09375rem 3.375rem 0 3.375rem;
}
<p
className="c0 c1"
>
Ooops, there's been an error
</p>

View File

@ -2,6 +2,7 @@
exports[`renders <Loader /> without throwing 1`] = `
.c1 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@ -9,6 +10,7 @@ exports[`renders <Loader /> without throwing 1`] = `
}
.c2 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@ -18,6 +20,7 @@ exports[`renders <Loader /> without throwing 1`] = `
}
.c3 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
@ -74,34 +77,105 @@ exports[`renders <Loader /> without throwing 1`] = `
<div
className="c0"
>
<svg
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
.c1 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
.c2 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
<svg
height="10"
width="28"
>
<rect
className="c1"
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
}
<rect
className="c0"
height="6"
width="6"
x="2"
y="2"
/>
<rect
className="c2"
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 0.5s;
animation-delay: 0.5s;
}
<rect
className="c0"
height="6"
width="6"
x="11"
y="2"
/>
<rect
className="c3"
.c0 {
-webkit-fill: ;
fill: ;
stroke: ;
-webkit-animation: iCqDak 1.5s ease-out 0s infinite;
animation: iCqDak 1.5s ease-out 0s infinite;
-webkit-animation-delay: 1s;
animation-delay: 1s;
}
<rect
className="c0"
height="6"
width="6"
x="20"
y="2"
/>
</svg>
<p
className="c4"
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
-webkit-flex: 0 0 auto;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
text-align: center;
margin-bottom: 0;
}
<p
className="c0"
>
Loading...
</p>

View File

@ -52,17 +52,17 @@ exports[`renders <ModalError /> without throwing 1`] = `
}
.c5::-moz-focus-inner,
.c5[type="button"]::-moz-focus-inner,
.c5[type="reset"]::-moz-focus-inner,
.c5[type="submit"]::-moz-focus-inner {
.c5[type='button']::-moz-focus-inner,
.c5[type='reset']::-moz-focus-inner,
.c5[type='submit']::-moz-focus-inner {
border-style: none;
padding: 0;
}
.c5:-moz-focusring,
.c5[type="button"]:-moz-focusring,
.c5[type="reset"]:-moz-focusring,
.c5[type="submit"]:-moz-focusring {
.c5[type='button']:-moz-focusring,
.c5[type='reset']:-moz-focusring,
.c5[type='submit']:-moz-focusring {
outline: 0.0625rem dotted ButtonText;
}
@ -142,19 +142,160 @@ exports[`renders <ModalError /> without throwing 1`] = `
}
<div>
<h2
.c2 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 500;
font-size: 1.5rem;
}
.c1 {
line-height: 1.25;
color: ;
margin: 0 0 0.75rem 0;
}
.c0 {
color: ;
}
<h2
className="c0 c1 c2"
/>
<p
className="c3 c4"
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
}
.c0 {
color: ;
margin: 0.75rem 0 1.875rem 0;
}
<p
className="c0 c1"
>
Modal error message
</p>
<button
className="c5"
.c0 {
font-family: sans-serif;
font-size: 100%;
line-height: 1.15;
margin: 0;
overflow: visible;
text-transform: none;
-webkit-appearance: button;
-moz-appearance: button;
appearance: button;
min-width: 7.5rem;
box-sizing: border-box;
display: inline-block;
-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;
margin: 0;
padding: 0.9375rem 1.125rem;
position: relative;
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
text-align: center;
font-style: normal;
font-stretch: normal;
line-height: normal;
-webkit-letter-spacing: normal;
-moz-letter-spacing: normal;
-ms-letter-spacing: normal;
letter-spacing: normal;
text-decoration: none;
white-space: nowrap;
vertical-align: middle;
touch-action: manipulation;
cursor: pointer;
color: ;
background-image: none;
background-color: ;
border-radius: 0.25rem;
border: solid 0.0625rem;
color: ;
background-color: ;
border-color: ;
}
.c0::-moz-focus-inner,
.c0[type='button']::-moz-focus-inner,
.c0[type='reset']::-moz-focus-inner,
.c0[type='submit']::-moz-focus-inner {
border-style: none;
padding: 0;
}
.c0:-moz-focusring,
.c0[type='button']:-moz-focusring,
.c0[type='reset']:-moz-focusring,
.c0[type='submit']:-moz-focusring {
outline: 0.0625rem dotted ButtonText;
}
.c0:focus {
outline: 0;
text-decoration: none;
background-color: ;
border-color: ;
}
.c0:hover {
background-color: ;
border: solid 0.0625rem;
}
.c0:active,
.c0:active:hover,
.c0:active:focus {
background-image: none;
outline: 0;
background-color: ;
border-color: ;
}
.c0[disabled] {
cursor: not-allowed;
pointer-events: none;
}
.c0:focus {
background-color: ;
border-color: ;
}
.c0:hover {
background-color: ;
border-color: ;
}
.c0:active,
.c0:active:hover,
.c0:active:focus {
background-color: ;
border-color: ;
}
.c0 + button {
margin-left: 1.25rem;
}
<button
className="c0"
onClick={[Function]}
>
Close
Close
</button>
</div>
`;

View File

@ -36,15 +36,50 @@ exports[`renders <Warning /> without throwing 1`] = `
<div
className="c0"
>
<div
className="c1"
.c0 {
position: absolute;
top: 0;
left: 0;
width: 2.25rem;
height: 100%;
background-color: ;
}
<div
className="c0"
type="WARNING"
/>
<div
className="c2"
.c2 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
}
.c0 {
padding: 0.75rem 0 0.84375rem 0;
}
.c1 {
margin: 0.09375rem 3.375rem 0 3.375rem;
}
<div
className="c0"
>
<p
className="c3 c4"
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
}
.c0 {
margin: 0.09375rem 3.375rem 0 3.375rem;
}
<p
className="c0 c1"
>
Warning message
</p>

View File

@ -85,39 +85,275 @@ exports[`renders <Header /> without throwing 1`] = `
height: 1.5625rem;
}
.c6 {
padding-left: 5px;
}
<div
className="c0"
>
<div
className="c1"
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 500;
font-size: 1.5rem;
text-transform: uppercase;
color: ;
font-size: 1.8125rem;
margin: 0;
}
.c0 {
-webkit-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
-webkit-order: 0;
-ms-flex-order: 0;
order: 0;
padding: 0.9375rem 0;
}
.c2 {
border-style: none;
width: 5.4375rem;
height: 1.5625rem;
}
<div
className="c0"
>
<h2
className="c2"
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 500;
font-size: 1.5rem;
text-transform: uppercase;
color: ;
font-size: 1.8125rem;
margin: 0;
}
.c1 {
border-style: none;
width: 5.4375rem;
height: 1.5625rem;
}
<h2
className="c0"
>
<a
.c0 {
border-style: none;
width: 5.4375rem;
height: 1.5625rem;
}
<a
href="/"
onClick={[Function]}
>
<img
className="c3"
.c0 {
border-style: none;
width: 5.4375rem;
height: 1.5625rem;
}
<img
className="c0"
src="test-file-mock"
/>
</a>
</h2>
</div>
<div
className="c4"
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
font-weight: 600;
text-align: center;
color: ;
margin: 0;
}
.c0 {
-webkit-flex: 0 1 auto;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
-webkit-align-self: auto;
-ms-flex-item-align: auto;
align-self: auto;
-webkit-order: 0;
-ms-flex-order: 0;
order: 0;
padding: 0.9375rem 0;
width: 6.25rem;
max-width: 6.25rem;
}
.c2 {
padding-left: 5px;
}
<div
className="c0"
>
<p
className="c5"
/>
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
font-weight: 600;
text-align: center;
color: ;
margin: 0;
}
.c1 {
padding-left: 5px;
}
<p
className="c0"
>
<svg
className=""
height="13"
viewBox="0 0 9 13"
width="9"
xmlns="http://www.w3.org/2000/svg"
>
<title>
icon: data center
</title>
<defs>
<linearGradient
id="a"
x1="49.967%"
x2="49.967%"
y1="100%"
y2="0%"
>
<stop
offset="0%"
stopColor="#E6E6E6"
/>
<stop
offset="100%"
stopColor="#FFF"
/>
</linearGradient>
</defs>
<path
d="M1174 34h9V21h-9v13zm2-2h5v-9h-5v9zm1-7h3.001v-1H1177v1zm0 2h3.001v-1H1177v1zm0 2h3.001v-1H1177v1z"
fill="url(#a)"
fillRule="evenodd"
transform="translate(-1174 -21)"
/>
</svg>
.c0 {
padding-left: 5px;
}
<span
className="c0"
/>
</p>
</div>
<div
className="c4"
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
font-weight: 600;
text-align: center;
color: ;
margin: 0;
}
.c0 {
-webkit-flex: 0 1 auto;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
-webkit-align-self: auto;
-ms-flex-item-align: auto;
align-self: auto;
-webkit-order: 0;
-ms-flex-order: 0;
order: 0;
padding: 0.9375rem 0;
width: 6.25rem;
max-width: 6.25rem;
}
.c2 {
padding-left: 5px;
}
<div
className="c0"
>
<p
className="c5"
/>
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
font-weight: 600;
text-align: center;
color: ;
margin: 0;
}
.c1 {
padding-left: 5px;
}
<p
className="c0"
>
<svg
className=""
height="12"
viewBox="0 0 12 12"
width="12"
xmlns="http://www.w3.org/2000/svg"
>
<title>
Shape
</title>
<defs>
<linearGradient
id="a"
x1="49.967%"
x2="49.967%"
y1="100%"
y2="0%"
>
<stop
offset="0%"
stopColor="#E6E6E6"
/>
<stop
offset="100%"
stopColor="#FFF"
/>
</linearGradient>
</defs>
<path
d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4C8.83 1.433 7.392 0 5.62 0z"
fill="url(#a)"
fillRule="nonzero"
/>
</svg>
.c0 {
padding-left: 5px;
}
<span
className="c0"
/>
</p>
</div>
</div>
`;

View File

@ -34,8 +34,14 @@ exports[`renders <Menu /> without throwing 1`] = `
<div
className="c0"
>
<ul
className="c1"
.c0 {
list-style-type: none;
padding: 0;
margin: 0;
}
<ul
className="c0"
/>
</div>
`;

View File

@ -131,21 +131,209 @@ exports[`renders <NotFound /> without throwing 1`] = `
<div
className="c0"
>
<div
className="c1"
.c5 {
display: inline-block;
box-sizing: border-box;
display: inline-block;
-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;
margin: 0;
padding: 0.9375rem 1.125rem;
position: relative;
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
text-align: center;
font-style: normal;
font-stretch: normal;
line-height: normal;
-webkit-letter-spacing: normal;
-moz-letter-spacing: normal;
-ms-letter-spacing: normal;
letter-spacing: normal;
text-decoration: none;
white-space: nowrap;
vertical-align: middle;
touch-action: manipulation;
cursor: pointer;
color: ;
background-image: none;
background-color: ;
border-radius: 0.25rem;
border: solid 0.0625rem;
}
.c5:focus {
outline: 0;
text-decoration: none;
background-color: ;
border-color: ;
}
.c5:hover {
background-color: ;
border: solid 0.0625rem;
}
.c5:active,
.c5:active:hover,
.c5:active:focus {
background-image: none;
outline: 0;
background-color: ;
border-color: ;
}
.c5[disabled] {
cursor: not-allowed;
pointer-events: none;
}
.c2 {
font-size: 2rem;
margin: 0.625rem 0;
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 500;
font-size: 2.25rem;
font-style: normal;
font-stretch: normal;
margin: 0;
}
.c4 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
}
.c0 {
margin-top: 3.75rem;
}
.c1 {
font-weight: normal;
font-size: 2rem;
}
.c3 {
margin-bottom: 1.875rem;
max-width: 30.625rem;
}
<div
className="c0"
>
<h1
className="c2 c3"
.c1 {
font-size: 2rem;
margin: 0.625rem 0;
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 500;
font-size: 2.25rem;
font-style: normal;
font-stretch: normal;
margin: 0;
}
.c0 {
font-weight: normal;
font-size: 2rem;
}
<h1
className="c0 c1"
>
I have no memory of this place
</h1>
<p
className="c4 c5"
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
}
.c0 {
margin-bottom: 1.875rem;
max-width: 30.625rem;
}
<p
className="c0 c1"
>
HTTP 404: We cant find what you are looking for. Next time, always follow your nose.
</p>
<a
className="c6"
.c0 {
display: inline-block;
box-sizing: border-box;
display: inline-block;
-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;
margin: 0;
padding: 0.9375rem 1.125rem;
position: relative;
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
text-align: center;
font-style: normal;
font-stretch: normal;
line-height: normal;
-webkit-letter-spacing: normal;
-moz-letter-spacing: normal;
-ms-letter-spacing: normal;
letter-spacing: normal;
text-decoration: none;
white-space: nowrap;
vertical-align: middle;
touch-action: manipulation;
cursor: pointer;
color: ;
background-image: none;
background-color: ;
border-radius: 0.25rem;
border: solid 0.0625rem;
}
.c0:focus {
outline: 0;
text-decoration: none;
background-color: ;
border-color: ;
}
.c0:hover {
background-color: ;
border: solid 0.0625rem;
}
.c0:active,
.c0:active:hover,
.c0:active:focus {
background-image: none;
outline: 0;
background-color: ;
border-color: ;
}
.c0[disabled] {
cursor: not-allowed;
pointer-events: none;
}
<a
className="c0"
href="/deployment-groups"
onClick={[Function]}
primary={true}

View File

@ -52,17 +52,17 @@ exports[`renders <Delete /> without throwing 1`] = `
}
.c4::-moz-focus-inner,
.c4[type="button"]::-moz-focus-inner,
.c4[type="reset"]::-moz-focus-inner,
.c4[type="submit"]::-moz-focus-inner {
.c4[type='button']::-moz-focus-inner,
.c4[type='reset']::-moz-focus-inner,
.c4[type='submit']::-moz-focus-inner {
border-style: none;
padding: 0;
}
.c4:-moz-focusring,
.c4[type="button"]:-moz-focusring,
.c4[type="reset"]:-moz-focusring,
.c4[type="submit"]:-moz-focusring {
.c4[type='button']:-moz-focusring,
.c4[type='reset']:-moz-focusring,
.c4[type='submit']:-moz-focusring {
outline: 0.0625rem dotted ButtonText;
}
@ -161,17 +161,17 @@ exports[`renders <Delete /> without throwing 1`] = `
}
.c5::-moz-focus-inner,
.c5[type="button"]::-moz-focus-inner,
.c5[type="reset"]::-moz-focus-inner,
.c5[type="submit"]::-moz-focus-inner {
.c5[type='button']::-moz-focus-inner,
.c5[type='reset']::-moz-focus-inner,
.c5[type='submit']::-moz-focus-inner {
border-style: none;
padding: 0;
}
.c5:-moz-focusring,
.c5[type="button"]:-moz-focusring,
.c5[type="reset"]:-moz-focusring,
.c5[type="submit"]:-moz-focusring {
.c5[type='button']:-moz-focusring,
.c5[type='reset']:-moz-focusring,
.c5[type='submit']:-moz-focusring {
outline: 0.0625rem dotted ButtonText;
}
@ -230,7 +230,19 @@ exports[`renders <Delete /> without throwing 1`] = `
}
<div>
<h2
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 500;
font-size: 1.5rem;
}
.c0 {
line-height: 1.25;
color: ;
margin: 0 0 0.75rem 0;
}
<h2
className="c0 c1"
>
Deleting a service:
@ -238,19 +250,235 @@ exports[`renders <Delete /> without throwing 1`] = `
Nginx
</h2>
<p
className="c2 c3"
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
}
.c0 {
color: ;
margin: 0.75rem 0 1.875rem 0;
}
<p
className="c0 c1"
>
Deleting a service can lead to irreversible loss of data and failures in your application. Are you sure you want to continue?
</p>
<button
className="c4"
.c0 {
font-family: sans-serif;
font-size: 100%;
line-height: 1.15;
margin: 0;
overflow: visible;
text-transform: none;
-webkit-appearance: button;
-moz-appearance: button;
appearance: button;
min-width: 7.5rem;
box-sizing: border-box;
display: inline-block;
-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;
margin: 0;
padding: 0.9375rem 1.125rem;
position: relative;
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
text-align: center;
font-style: normal;
font-stretch: normal;
line-height: normal;
-webkit-letter-spacing: normal;
-moz-letter-spacing: normal;
-ms-letter-spacing: normal;
letter-spacing: normal;
text-decoration: none;
white-space: nowrap;
vertical-align: middle;
touch-action: manipulation;
cursor: pointer;
color: ;
background-image: none;
background-color: ;
border-radius: 0.25rem;
border: solid 0.0625rem;
color: ;
background-color: ;
border-color: ;
}
.c0::-moz-focus-inner,
.c0[type='button']::-moz-focus-inner,
.c0[type='reset']::-moz-focus-inner,
.c0[type='submit']::-moz-focus-inner {
border-style: none;
padding: 0;
}
.c0:-moz-focusring,
.c0[type='button']:-moz-focusring,
.c0[type='reset']:-moz-focusring,
.c0[type='submit']:-moz-focusring {
outline: 0.0625rem dotted ButtonText;
}
.c0:focus {
outline: 0;
text-decoration: none;
background-color: ;
border-color: ;
}
.c0:hover {
background-color: ;
border: solid 0.0625rem;
}
.c0:active,
.c0:active:hover,
.c0:active:focus {
background-image: none;
outline: 0;
background-color: ;
border-color: ;
}
.c0[disabled] {
cursor: not-allowed;
pointer-events: none;
}
.c0:focus {
background-color: ;
border-color: ;
}
.c0:hover {
background-color: ;
border-color: ;
}
.c0:active,
.c0:active:hover,
.c0:active:focus {
background-color: ;
border-color: ;
}
.c0 + button {
margin-left: 1.25rem;
}
<button
className="c0"
onClick={[Function]}
>
Cancel
</button>
<button
className="c5"
.c0 {
font-family: sans-serif;
font-size: 100%;
line-height: 1.15;
margin: 0;
overflow: visible;
text-transform: none;
-webkit-appearance: button;
-moz-appearance: button;
appearance: button;
min-width: 7.5rem;
box-sizing: border-box;
display: inline-block;
-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;
margin: 0;
padding: 0.9375rem 1.125rem;
position: relative;
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
font-size: 0.9375rem;
text-align: center;
font-style: normal;
font-stretch: normal;
line-height: normal;
-webkit-letter-spacing: normal;
-moz-letter-spacing: normal;
-ms-letter-spacing: normal;
letter-spacing: normal;
text-decoration: none;
white-space: nowrap;
vertical-align: middle;
touch-action: manipulation;
cursor: pointer;
color: ;
background-image: none;
background-color: ;
border-radius: 0.25rem;
border: solid 0.0625rem;
}
.c0::-moz-focus-inner,
.c0[type='button']::-moz-focus-inner,
.c0[type='reset']::-moz-focus-inner,
.c0[type='submit']::-moz-focus-inner {
border-style: none;
padding: 0;
}
.c0:-moz-focusring,
.c0[type='button']:-moz-focusring,
.c0[type='reset']:-moz-focusring,
.c0[type='submit']:-moz-focusring {
outline: 0.0625rem dotted ButtonText;
}
.c0:focus {
outline: 0;
text-decoration: none;
background-color: ;
border-color: ;
}
.c0:hover {
background-color: ;
border: solid 0.0625rem;
}
.c0:active,
.c0:active:hover,
.c0:active:focus {
background-image: none;
outline: 0;
background-color: ;
border-color: ;
}
.c0[disabled] {
cursor: not-allowed;
pointer-events: none;
}
.c0 + button {
margin-left: 1.25rem;
}
<button
className="c0"
onClick={[Function]}
>
Delete service

View File

@ -9,9 +9,6 @@ import 'jest-styled-components';
import ServiceListItem from '@components/services/list-item';
import { Router, service } from '../../mocks';
console.log(service);
it('renders <ServiceListItem /> without throwing', () => {
const tree = renderer
.create(
@ -28,4 +25,4 @@ it('renders child <ServiceListItem /> without throwing', () => {
.create(<ServiceListItem service={service} isChild />)
.toJSON();
expect(tree).toMatchSnapshot();
});
});

View File

@ -36,7 +36,7 @@ exports[`renders <InstancesTooltip /> without throwing 1`] = `
.c2:after,
.c2:before {
content: "";
content: '';
position: absolute;
bottom: 100%;
left: 50%;
@ -72,14 +72,139 @@ exports[`renders <InstancesTooltip /> without throwing 1`] = `
<div
className="c0"
>
<div
className="c1"
.c3 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
}
.c0 {
position: absolute;
top: auto;
left: auto;
bottom: ;
right: auto;
}
.c0:focus {
outline: none;
}
.c1 {
position: relative;
display: inline-block;
top: 0.3125rem;
left: -50%;
margin: 0;
padding: 0.75rem 0;
background-color: ;
border: 0.0625rem solid;
box-shadow: 0 0.125rem 0.375rem 0.0625rem rgba(0,0,0,0.1);
border-radius: 0.25rem;
z-index: 1000;
}
.c1:after,
.c1:before {
content: '';
position: absolute;
bottom: 100%;
left: 50%;
height: 0;
width: 0;
border: solid transparent;
}
.c1:after {
border-bottom-color: ;
border-width: 0.1875rem;
margin-left: -0.1875rem;
}
.c1:before {
border-bottom-color: ;
border-width: 0.3125rem;
margin-left: -0.3125rem;
}
.c2 {
margin: 0 1.125rem;
color: ;
white-space: nowrap;
}
<div
className="c0"
>
<div
className="c2"
.c2 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
}
.c0 {
position: relative;
display: inline-block;
top: 0.3125rem;
left: -50%;
margin: 0;
padding: 0.75rem 0;
background-color: ;
border: 0.0625rem solid;
box-shadow: 0 0.125rem 0.375rem 0.0625rem rgba(0,0,0,0.1);
border-radius: 0.25rem;
z-index: 1000;
}
.c0:after,
.c0:before {
content: '';
position: absolute;
bottom: 100%;
left: 50%;
height: 0;
width: 0;
border: solid transparent;
}
.c0:after {
border-bottom-color: ;
border-width: 0.1875rem;
margin-left: -0.1875rem;
}
.c0:before {
border-bottom-color: ;
border-width: 0.3125rem;
margin-left: -0.3125rem;
}
.c1 {
margin: 0 1.125rem;
color: ;
white-space: nowrap;
}
<div
className="c0"
>
<p
className="c3 c4"
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
}
.c0 {
margin: 0 1.125rem;
color: ;
white-space: nowrap;
}
<p
className="c0 c1"
>
Your instance is operating as expected
</p>

View File

@ -1,3 +0,0 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`renders <DeploymentGroupEditOrCreate /> without throwing 1`] = `null`;

View File

@ -85,39 +85,275 @@ exports[`renders <Header /> without throwing 1`] = `
height: 1.5625rem;
}
.c6 {
padding-left: 5px;
}
<div
className="c0"
>
<div
className="c1"
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 500;
font-size: 1.5rem;
text-transform: uppercase;
color: ;
font-size: 1.8125rem;
margin: 0;
}
.c0 {
-webkit-flex: 1 1 auto;
-ms-flex: 1 1 auto;
flex: 1 1 auto;
-webkit-align-self: stretch;
-ms-flex-item-align: stretch;
align-self: stretch;
-webkit-order: 0;
-ms-flex-order: 0;
order: 0;
padding: 0.9375rem 0;
}
.c2 {
border-style: none;
width: 5.4375rem;
height: 1.5625rem;
}
<div
className="c0"
>
<h2
className="c2"
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 500;
font-size: 1.5rem;
text-transform: uppercase;
color: ;
font-size: 1.8125rem;
margin: 0;
}
.c1 {
border-style: none;
width: 5.4375rem;
height: 1.5625rem;
}
<h2
className="c0"
>
<a
.c0 {
border-style: none;
width: 5.4375rem;
height: 1.5625rem;
}
<a
href="/"
onClick={[Function]}
>
<img
className="c3"
.c0 {
border-style: none;
width: 5.4375rem;
height: 1.5625rem;
}
<img
className="c0"
src="test-file-mock"
/>
</a>
</h2>
</div>
<div
className="c4"
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
font-weight: 600;
text-align: center;
color: ;
margin: 0;
}
.c0 {
-webkit-flex: 0 1 auto;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
-webkit-align-self: auto;
-ms-flex-item-align: auto;
align-self: auto;
-webkit-order: 0;
-ms-flex-order: 0;
order: 0;
padding: 0.9375rem 0;
width: 6.25rem;
max-width: 6.25rem;
}
.c2 {
padding-left: 5px;
}
<div
className="c0"
>
<p
className="c5"
/>
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
font-weight: 600;
text-align: center;
color: ;
margin: 0;
}
.c1 {
padding-left: 5px;
}
<p
className="c0"
>
<svg
className=""
height="13"
viewBox="0 0 9 13"
width="9"
xmlns="http://www.w3.org/2000/svg"
>
<title>
icon: data center
</title>
<defs>
<linearGradient
id="a"
x1="49.967%"
x2="49.967%"
y1="100%"
y2="0%"
>
<stop
offset="0%"
stopColor="#E6E6E6"
/>
<stop
offset="100%"
stopColor="#FFF"
/>
</linearGradient>
</defs>
<path
d="M1174 34h9V21h-9v13zm2-2h5v-9h-5v9zm1-7h3.001v-1H1177v1zm0 2h3.001v-1H1177v1zm0 2h3.001v-1H1177v1z"
fill="url(#a)"
fillRule="evenodd"
transform="translate(-1174 -21)"
/>
</svg>
.c0 {
padding-left: 5px;
}
<span
className="c0"
/>
</p>
</div>
<div
className="c4"
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
font-weight: 600;
text-align: center;
color: ;
margin: 0;
}
.c0 {
-webkit-flex: 0 1 auto;
-ms-flex: 0 1 auto;
flex: 0 1 auto;
-webkit-align-self: auto;
-ms-flex-item-align: auto;
align-self: auto;
-webkit-order: 0;
-ms-flex-order: 0;
order: 0;
padding: 0.9375rem 0;
width: 6.25rem;
max-width: 6.25rem;
}
.c2 {
padding-left: 5px;
}
<div
className="c0"
>
<p
className="c5"
/>
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
line-height: 1.5rem;
font-size: 0.9375rem;
font-weight: 600;
text-align: center;
color: ;
margin: 0;
}
.c1 {
padding-left: 5px;
}
<p
className="c0"
>
<svg
className=""
height="12"
viewBox="0 0 12 12"
width="12"
xmlns="http://www.w3.org/2000/svg"
>
<title>
Shape
</title>
<defs>
<linearGradient
id="a"
x1="49.967%"
x2="49.967%"
y1="100%"
y2="0%"
>
<stop
offset="0%"
stopColor="#E6E6E6"
/>
<stop
offset="100%"
stopColor="#FFF"
/>
</linearGradient>
</defs>
<path
d="M12 12H0a5.958 5.958 0 0 1 1.485-3.552 1.368 1.368 0 0 1 1.726-.296 4.83 4.83 0 0 0 5.201-.248 1.384 1.384 0 0 1 1.75.152A5.968 5.968 0 0 1 12 12zM5.619 0a3.205 3.205 0 0 0-3.211 3.2c0 1.768 1.42 4 3.21 4s3.211-2.232 3.211-4C8.83 1.433 7.392 0 5.62 0z"
fill="url(#a)"
fillRule="nonzero"
/>
</svg>
.c0 {
padding-left: 5px;
}
<span
className="c0"
/>
</p>
</div>
</div>
`;

View File

@ -559,6 +559,8 @@ exports[`renders <ServiceScale /> without throwing 1`] = `
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
float: right;
}
@ -600,12 +602,6 @@ exports[`renders <ServiceScale /> without throwing 1`] = `
vertical-align: middle;
}
@media only screen and (min-width:48.0625rem) {
.c10 {
text-align: right;
}
}
<div
className="c0"
>
@ -1157,6 +1153,8 @@ exports[`renders <ServiceScale /> without throwing 1`] = `
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
float: right;
}
@ -1198,12 +1196,6 @@ exports[`renders <ServiceScale /> without throwing 1`] = `
vertical-align: middle;
}
@media only screen and (min-width:48.0625rem) {
.c9 {
text-align: right;
}
}
<div
className="c0"
width={460}
@ -1765,6 +1757,8 @@ exports[`renders <ServiceScale /> without throwing 1`] = `
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
float: right;
}
@ -1806,12 +1800,6 @@ exports[`renders <ServiceScale /> without throwing 1`] = `
vertical-align: middle;
}
@media only screen and (min-width:48.0625rem) {
.c5 {
text-align: right;
}
}
<form
onSubmit={[Function]}
>
@ -2002,6 +1990,8 @@ exports[`renders <ServiceScale /> without throwing 1`] = `
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
float: right;
}
@ -2043,12 +2033,6 @@ exports[`renders <ServiceScale /> without throwing 1`] = `
vertical-align: middle;
}
@media only screen and (min-width:48.0625rem) {
.c1 {
text-align: right;
}
}
<fieldset
className="c0"
style={undefined}
@ -2187,6 +2171,8 @@ exports[`renders <ServiceScale /> without throwing 1`] = `
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
float: right;
}
@ -2228,12 +2214,6 @@ exports[`renders <ServiceScale /> without throwing 1`] = `
vertical-align: middle;
}
@media only screen and (min-width:48.0625rem) {
.c0 {
text-align: right;
}
}
<div>
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
@ -2241,16 +2221,12 @@ exports[`renders <ServiceScale /> without throwing 1`] = `
font-size: 0.9375rem;
font-style: normal;
font-stretch: normal;
font-weight: bold;
display: block;
color: ;
float: right;
}
@media only screen and (min-width:48.0625rem) {
.c0 {
text-align: right;
}
}
<label
className="c0"
form="scale-service"
@ -2458,7 +2434,7 @@ exports[`renders <ServiceScale /> without throwing 1`] = `
<input
className="c0 c1"
id="bCQKRx"
id="YOGS"
name="replicas"
onBlur={[Function]}
onChange={[Function]}

View File

@ -1085,7 +1085,7 @@ exports[`renders <ServicesMenu /> without throwing 1`] = `
<li
className="c0"
id="bvFZym"
id="ckYfBi"
>
.c1 {
font-family: sans-serif;
@ -1236,7 +1236,7 @@ exports[`renders <ServicesMenu /> without throwing 1`] = `
<input
checked={false}
className="c0"
id="cjPeBX"
id="cjJOWd"
name="service-view"
onChange={[Function]}
type="radio"
@ -1262,7 +1262,7 @@ exports[`renders <ServicesMenu /> without throwing 1`] = `
<label
className="c0"
htmlFor="cjPeBX"
htmlFor="cjJOWd"
>
List
</label>
@ -1372,7 +1372,7 @@ exports[`renders <ServicesMenu /> without throwing 1`] = `
<li
className="c0"
id="bvFZym"
id="ckYfBi"
>
.c1 {
font-family: sans-serif;
@ -1523,7 +1523,7 @@ exports[`renders <ServicesMenu /> without throwing 1`] = `
<input
checked={false}
className="c0"
id="coLjmH"
id="bVLDyd"
name="service-view"
onChange={[Function]}
type="radio"
@ -1549,7 +1549,7 @@ exports[`renders <ServicesMenu /> without throwing 1`] = `
<label
className="c0"
htmlFor="coLjmH"
htmlFor="bVLDyd"
>
Topology
</label>

View File

@ -9,30 +9,36 @@ exports[`renders <ServicesTopology /> without throwing 1`] = `
.c3 {
stroke: ;
-webkit-fill: ;
fill: ;
stroke-width: 1.5;
rx: 4;
ry: 4;
stroke: ;
-webkit-fill: ;
fill: ;
}
.c4 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 16px;
font-weight: 600;
-webkit-fill: ;
fill: ;
cursor: pointer;
}
.c9 {
.c10 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 12px;
opacity: 0.8;
-webkit-fill: ;
fill: ;
}
@ -46,12 +52,21 @@ exports[`renders <ServicesTopology /> without throwing 1`] = `
}
.c6 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
.c8 {
-webkit-fill: ;
fill: ;
}
.c9 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
@ -74,15 +89,340 @@ exports[`renders <ServicesTopology /> without throwing 1`] = `
}
<div>
<div
.c5 {
stroke: ;
stroke-width: 1.5;
stroke: ;
}
.c3 {
stroke: ;
-webkit-fill: ;
fill: ;
stroke-width: 1.5;
rx: 4;
ry: 4;
stroke: ;
-webkit-fill: ;
fill: ;
}
.c4 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 16px;
font-weight: 600;
-webkit-fill: ;
fill: ;
cursor: pointer;
}
.c10 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 12px;
opacity: 0.8;
-webkit-fill: ;
fill: ;
}
.c7 {
opacity: 0;
cursor: pointer;
}
.c7:focus {
outline: none;
}
.c6 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
.c8 {
-webkit-fill: ;
fill: ;
}
.c9 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
.c2 {
width: 100%;
height: 1000px;
}
.c2:not(:root) {
overflow: hidden;
}
.c0 {
padding: 1.5rem;
background-color: ;
}
.c1 {
position: relative;
}
<div
className="c0"
>
<div
className="c1"
.c4 {
stroke: ;
stroke-width: 1.5;
stroke: ;
}
.c2 {
stroke: ;
-webkit-fill: ;
fill: ;
stroke-width: 1.5;
rx: 4;
ry: 4;
stroke: ;
-webkit-fill: ;
fill: ;
}
.c3 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 16px;
font-weight: 600;
-webkit-fill: ;
fill: ;
cursor: pointer;
}
.c9 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 12px;
opacity: 0.8;
-webkit-fill: ;
fill: ;
}
.c6 {
opacity: 0;
cursor: pointer;
}
.c6:focus {
outline: none;
}
.c5 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
.c7 {
-webkit-fill: ;
fill: ;
}
.c8 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
.c1 {
width: 100%;
height: 1000px;
}
.c1:not(:root) {
overflow: hidden;
}
.c0 {
position: relative;
}
<div
className="c0"
>
<div>
<svg
className="c2"
.c3 {
stroke: ;
stroke-width: 1.5;
stroke: ;
}
.c1 {
stroke: ;
-webkit-fill: ;
fill: ;
stroke-width: 1.5;
rx: 4;
ry: 4;
stroke: ;
-webkit-fill: ;
fill: ;
}
.c2 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 16px;
font-weight: 600;
-webkit-fill: ;
fill: ;
cursor: pointer;
}
.c8 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 12px;
opacity: 0.8;
-webkit-fill: ;
fill: ;
}
.c5 {
opacity: 0;
cursor: pointer;
}
.c5:focus {
outline: none;
}
.c4 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
.c6 {
-webkit-fill: ;
fill: ;
}
.c7 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
.c0 {
width: 100%;
height: 1000px;
}
.c0:not(:root) {
overflow: hidden;
}
<div>
.c3 {
stroke: ;
stroke-width: 1.5;
stroke: ;
}
.c1 {
stroke: ;
-webkit-fill: ;
fill: ;
stroke-width: 1.5;
rx: 4;
ry: 4;
stroke: ;
-webkit-fill: ;
fill: ;
}
.c2 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 16px;
font-weight: 600;
-webkit-fill: ;
fill: ;
cursor: pointer;
}
.c8 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 12px;
opacity: 0.8;
-webkit-fill: ;
fill: ;
}
.c5 {
opacity: 0;
cursor: pointer;
}
.c5:focus {
outline: none;
}
.c4 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
.c6 {
-webkit-fill: ;
fill: ;
}
.c7 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
.c0 {
width: 100%;
height: 1000px;
}
.c0:not(:root) {
overflow: hidden;
}
<svg
className="c0"
id="topology-svg"
onMouseMove={[Function]}
onMouseUp={[Function]}
@ -90,20 +430,194 @@ exports[`renders <ServicesTopology /> without throwing 1`] = `
onTouchEnd={[Function]}
onTouchMove={[Function]}
>
<g>
<g
.c2 {
stroke: ;
stroke-width: 1.5;
stroke: ;
}
.c0 {
stroke: ;
-webkit-fill: ;
fill: ;
stroke-width: 1.5;
rx: 4;
ry: 4;
stroke: ;
-webkit-fill: ;
fill: ;
}
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 16px;
font-weight: 600;
-webkit-fill: ;
fill: ;
cursor: pointer;
}
.c7 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 12px;
opacity: 0.8;
-webkit-fill: ;
fill: ;
}
.c4 {
opacity: 0;
cursor: pointer;
}
.c4:focus {
outline: none;
}
.c3 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
.c5 {
-webkit-fill: ;
fill: ;
}
.c6 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
<g>
.c2 {
stroke: ;
stroke-width: 1.5;
stroke: ;
}
.c0 {
stroke: ;
-webkit-fill: ;
fill: ;
stroke-width: 1.5;
rx: 4;
ry: 4;
stroke: ;
-webkit-fill: ;
fill: ;
}
.c1 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 16px;
font-weight: 600;
-webkit-fill: ;
fill: ;
cursor: pointer;
}
.c7 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 12px;
opacity: 0.8;
-webkit-fill: ;
fill: ;
}
.c4 {
opacity: 0;
cursor: pointer;
}
.c4:focus {
outline: none;
}
.c3 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
.c5 {
-webkit-fill: ;
fill: ;
}
.c6 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
<g
transform="translate(0, 0)"
>
<rect
className="c3"
.c0 {
stroke: ;
-webkit-fill: ;
fill: ;
stroke-width: 1.5;
rx: 4;
ry: 4;
stroke: ;
-webkit-fill: ;
fill: ;
}
<rect
className="c0"
height={114}
width={180}
x={0}
y={0}
/>
<g>
<text
className="c4"
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 16px;
font-weight: 600;
-webkit-fill: ;
fill: ;
cursor: pointer;
}
<g>
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 16px;
font-weight: 600;
-webkit-fill: ;
fill: ;
cursor: pointer;
}
<text
className="c0"
onClick={[Function]}
onKeyDown={[Function]}
x={12}
@ -112,36 +626,94 @@ exports[`renders <ServicesTopology /> without throwing 1`] = `
Nginx
</text>
</g>
<g
.c0 {
stroke: ;
stroke-width: 1.5;
stroke: ;
}
.c2 {
opacity: 0;
cursor: pointer;
}
.c2:focus {
outline: none;
}
.c1 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
<g
transform="translate(140, 0)"
>
<line
className="c5"
.c0 {
stroke: ;
stroke-width: 1.5;
stroke: ;
}
<line
className="c0"
x1={0}
x2={0}
y1={0}
y2={48}
/>
<circle
className="c6"
.c0 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
<circle
className="c0"
cx={20}
cy={18}
r={2}
/>
<circle
className="c6"
.c0 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
<circle
className="c0"
cx={20}
cy={24}
r={2}
/>
<circle
className="c6"
.c0 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
<circle
className="c0"
cx={20}
cy={30}
r={2}
/>
<rect
className="c7"
.c0 {
opacity: 0;
cursor: pointer;
}
.c0:focus {
outline: none;
}
<rect
className="c0"
height={48}
onClick={[Function]}
onKeyDown={[Function]}
@ -150,61 +722,136 @@ exports[`renders <ServicesTopology /> without throwing 1`] = `
width={40}
/>
</g>
<g
.c0 {
stroke: ;
stroke-width: 1.5;
stroke: ;
}
.c3 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 12px;
opacity: 0.8;
-webkit-fill: ;
fill: ;
}
.c1 {
-webkit-fill: ;
fill: ;
}
.c2 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
<g
transform="translate(0, 48)"
>
<line
className="c5"
.c0 {
stroke: ;
stroke-width: 1.5;
stroke: ;
}
<line
className="c0"
x1={0}
x2={180}
y1={0}
y2={0}
/>
<g
.c2 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 12px;
opacity: 0.8;
-webkit-fill: ;
fill: ;
}
.c0 {
-webkit-fill: ;
fill: ;
}
.c1 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
<g
transform="translate(12, 11)"
>
<g
.c0 {
-webkit-fill: ;
fill: ;
}
<g
transform="translate(0, 0)"
>
<svg
className=""
.c0 {
-webkit-fill: ;
fill: ;
}
<svg
className="c0"
healthy="UNHEALTHY"
height="18"
viewBox="0 0 18 18"
width="18"
xmlns="http://www.w3.org/2000/svg"
>
<title>
icon: error
icon: state
</title>
<g
fill="none"
fillRule="evenodd"
>
<circle
cx="9"
cy="9"
fill="#DA4B42"
r="9"
/>
<g
<path
d="M9.477 6.603l-.522.443-.444-.443a2.056 2.056 0 1 0-2.908 2.909l3.352 3.352 3.412-3.352c.803-.804.863-2.106.06-2.91a2.105 2.105 0 0 0-2.95 0z"
fill="#FFF"
>
<path
d="M11.121 5.464l1.415 1.415-5.657 5.657-1.415-1.415z"
/>
<path
d="M12.536 11.121l-1.415 1.415-5.657-5.657L6.88 5.464z"
/>
</g>
/>
</g>
</svg>
</g>
<g
.c0 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
<g
transform="translate(30, 4.5)"
>
<svg
.c0 {
-webkit-fill: ;
fill: ;
-webkit-fill: ;
fill: ;
}
<svg
active={undefined}
className="c8"
className="c0"
consul={undefined}
height="9"
viewBox="0 0 18 9"
@ -220,21 +867,54 @@ exports[`renders <ServicesTopology /> without throwing 1`] = `
/>
</svg>
</g>
<text
className="c9"
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 12px;
opacity: 0.8;
-webkit-fill: ;
fill: ;
}
<text
className="c0"
x={54}
y={14}
>
1 inst.
</text>
<g
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 12px;
opacity: 0.8;
-webkit-fill: ;
fill: ;
}
<g
transform="translate(54, 36)"
>
<text
className="c9"
.c0 {
font-family: "Libre Franklin",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Oxygen-Sans,Ubuntu,Cantarell,Helvetica,sans-serif;
font-weight: 400;
-webkit-fill: ;
fill: ;
font-size: 12px;
opacity: 0.8;
-webkit-fill: ;
fill: ;
}
<text
className="c0"
>
1
running
running
</text>
</g>
</g>

View File

@ -9,6 +9,7 @@ import 'jest-styled-components';
import { ServicesTopology } from '@containers/services/topology.js';
import { Router, Store, services } from '../../mocks';
it('renders <ServicesTopology /> without throwing', () => {
const tree = renderer
.create(
@ -20,4 +21,4 @@ it('renders <ServicesTopology /> without throwing', () => {
)
.toJSON();
expect(tree).toMatchSnapshot();
});
});

View File

@ -24,8 +24,15 @@ export const deploymentGroup = {
name: 'Wordpress Blog Example'
};
export const file = {
id: 'test',
onRemoveFile: () => {},
readOnly: true
};
export const services = [service];
export const instances = [instance];
export const files = [file];
export const deploymentGroups = [deploymentGroup];
export const deploymentGroups = [deploymentGroup];

View File

@ -1,6 +1,4 @@
import {
deploymentGroupBySlugSelector,
serviceBySlugSelector,
getInstanceStatuses,
getInstancesActive,
getInstancesHealthy,
@ -244,4 +242,4 @@ const consulExpectedResult = {
transitionalStatus: true,
isConsul: true,
index: 1
};
};

View File

@ -61,7 +61,7 @@ const GraphNodeInfo = ({ data, pos }) => {
const healthy = (
<HealthyIcon
healthy={
instancesHealthy.total === instancesHealthy.healthy ? (
instancesHealthy && instancesHealthy.total === instancesHealthy.healthy ? (
'HEALTHY'
) : (
'UNHEALTHY'
@ -95,4 +95,4 @@ GraphNodeInfo.propTypes = {
pos: Point.isRequired
};
export default Baseline(GraphNodeInfo);
export default Baseline(GraphNodeInfo);