Skip to content

Commit

Permalink
Beefed up tests for EuiCodeBlock
Browse files Browse the repository at this point in the history
  • Loading branch information
cchaos committed Oct 21, 2019
1 parent 0e78cad commit 7abe6c1
Show file tree
Hide file tree
Showing 2 changed files with 326 additions and 0 deletions.
251 changes: 251 additions & 0 deletions src/components/code/__snapshots__/code_block.test.js.snap
View file
Original file line number Diff line number Diff line change
@@ -1,5 +1,256 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`EuiCodeBlock props fontSize l is rendered 1`] = `
<div
class="euiCodeBlock euiCodeBlock--fontLarge euiCodeBlock--paddingLarge"
>
<pre
class="euiCodeBlock__pre"
>
<code
class="euiCodeBlock__code"
>
var some = 'code';
console.log(some);
</code>
</pre>
</div>
`;

exports[`EuiCodeBlock props fontSize m is rendered 1`] = `
<div
class="euiCodeBlock euiCodeBlock--fontMedium euiCodeBlock--paddingLarge"
>
<pre
class="euiCodeBlock__pre"
>
<code
class="euiCodeBlock__code"
>
var some = 'code';
console.log(some);
</code>
</pre>
</div>
`;

exports[`EuiCodeBlock props fontSize s is rendered 1`] = `
<div
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge"
>
<pre
class="euiCodeBlock__pre"
>
<code
class="euiCodeBlock__code"
>
var some = 'code';
console.log(some);
</code>
</pre>
</div>
`;

exports[`EuiCodeBlock props inline is rendered 1`] = `
<div
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge"
>
<pre
class="euiCodeBlock__pre"
>
<code
class="euiCodeBlock__code"
>
var some = 'code';
console.log(some);
</code>
</pre>
</div>
`;

exports[`EuiCodeBlock props isCopyable is rendered 1`] = `
<div
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--hasControls"
>
<pre
class="euiCodeBlock__pre"
>
<code
class="euiCodeBlock__code"
>
var some = 'code';
console.log(some);
</code>
</pre>
<div
class="euiCodeBlock__controls"
>
<div
class="euiCodeBlock__copyButton"
>
<span
class="euiToolTipAnchor"
>
<button
aria-label="Copy"
class="euiButtonIcon euiButtonIcon--text"
type="button"
>
<svg
aria-hidden="true"
class="euiIcon euiIcon--medium euiIcon-isLoading euiButtonIcon__icon"
focusable="false"
height="16"
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
/>
</button>
</span>
</div>
</div>
</div>
`;

exports[`EuiCodeBlock props language is rendered 1`] = `
<div
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge"
>
<pre
class="euiCodeBlock__pre"
>
<code
class="euiCodeBlock__code html"
>
var some = 'code';
console.log(some);
</code>
</pre>
</div>
`;

exports[`EuiCodeBlock props overflowHeight is rendered 1`] = `
<div
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--hasControls"
style="max-height:200px"
>
<pre
class="euiCodeBlock__pre"
>
<code
class="euiCodeBlock__code"
>
var some = 'code';
console.log(some);
</code>
</pre>
<div
class="euiCodeBlock__controls"
>
<button
aria-label="Expand"
class="euiButtonIcon euiButtonIcon--text euiCodeBlock__fullScreenButton"
type="button"
>
<svg
aria-hidden="true"
class="euiIcon euiIcon--medium euiIcon-isLoading euiButtonIcon__icon"
focusable="false"
height="16"
viewBox="0 0 16 16"
width="16"
xmlns="http://www.w3.org/2000/svg"
/>
</button>
</div>
</div>
`;

exports[`EuiCodeBlock props paddingSize l is rendered 1`] = `
<div
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge"
>
<pre
class="euiCodeBlock__pre"
>
<code
class="euiCodeBlock__code"
>
var some = 'code';
console.log(some);
</code>
</pre>
</div>
`;

exports[`EuiCodeBlock props paddingSize m is rendered 1`] = `
<div
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingMedium"
>
<pre
class="euiCodeBlock__pre"
>
<code
class="euiCodeBlock__code"
>
var some = 'code';
console.log(some);
</code>
</pre>
</div>
`;

exports[`EuiCodeBlock props paddingSize none is rendered 1`] = `
<div
class="euiCodeBlock euiCodeBlock--fontSmall"
>
<pre
class="euiCodeBlock__pre"
>
<code
class="euiCodeBlock__code"
>
var some = 'code';
console.log(some);
</code>
</pre>
</div>
`;

exports[`EuiCodeBlock props paddingSize s is rendered 1`] = `
<div
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingSmall"
>
<pre
class="euiCodeBlock__pre"
>
<code
class="euiCodeBlock__code"
>
var some = 'code';
console.log(some);
</code>
</pre>
</div>
`;

exports[`EuiCodeBlock props transparentBackground is rendered 1`] = `
<div
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge euiCodeBlock--transparentBackground"
>
<pre
class="euiCodeBlock__pre"
>
<code
class="euiCodeBlock__code"
>
var some = 'code';
console.log(some);
</code>
</pre>
</div>
`;

exports[`EuiCodeBlock renders a code block 1`] = `
<div
class="euiCodeBlock euiCodeBlock--fontSmall euiCodeBlock--paddingLarge testClass1 testClass2"
Expand Down
75 changes: 75 additions & 0 deletions src/components/code/code_block.test.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,6 +3,7 @@ import { render } from 'enzyme';
import { requiredProps } from '../../test/required_props';

import { EuiCodeBlock } from './code_block';
import { FONT_SIZES, PADDING_SIZES } from './_code_block';

const code = `var some = 'code';
console.log(some);`;
Expand All @@ -15,4 +16,78 @@ describe('EuiCodeBlock', () => {

expect(component).toMatchSnapshot();
});

describe('props', () => {
describe('transparentBackground', () => {
it('is rendered', () => {
const component = render(
<EuiCodeBlock transparentBackground>{code}</EuiCodeBlock>
);

expect(component).toMatchSnapshot();
});
});

describe('isCopyable', () => {
it('is rendered', () => {
const component = render(
<EuiCodeBlock isCopyable>{code}</EuiCodeBlock>
);

expect(component).toMatchSnapshot();
});
});

describe('overflowHeight', () => {
it('is rendered', () => {
const component = render(
<EuiCodeBlock overflowHeight={200}>{code}</EuiCodeBlock>
);

expect(component).toMatchSnapshot();
});
});

describe('language', () => {
it('is rendered', () => {
const component = render(
<EuiCodeBlock language="html">{code}</EuiCodeBlock>
);

expect(component).toMatchSnapshot();
});
});

describe('inline', () => {
it('is rendered', () => {
const component = render(<EuiCodeBlock inline>{code}</EuiCodeBlock>);

expect(component).toMatchSnapshot();
});
});

describe('fontSize', () => {
FONT_SIZES.forEach(fontSize => {
test(`${fontSize} is rendered`, () => {
const component = render(
<EuiCodeBlock fontSize={fontSize}>{code}</EuiCodeBlock>
);

expect(component).toMatchSnapshot();
});
});
});

describe('paddingSize', () => {
PADDING_SIZES.forEach(paddingSize => {
test(`${paddingSize} is rendered`, () => {
const component = render(
<EuiCodeBlock paddingSize={paddingSize}>{code}</EuiCodeBlock>
);

expect(component).toMatchSnapshot();
});
});
});
});
});

0 comments on commit 7abe6c1

Please sign in to comment.