diff options
Diffstat (limited to 'spec/frontend/static_site_editor/services/renderers/render_image_spec.js')
-rw-r--r-- | spec/frontend/static_site_editor/services/renderers/render_image_spec.js | 96 |
1 files changed, 96 insertions, 0 deletions
diff --git a/spec/frontend/static_site_editor/services/renderers/render_image_spec.js b/spec/frontend/static_site_editor/services/renderers/render_image_spec.js new file mode 100644 index 00000000000..e9e40835982 --- /dev/null +++ b/spec/frontend/static_site_editor/services/renderers/render_image_spec.js @@ -0,0 +1,96 @@ +import imageRenderer from '~/static_site_editor/services/renderers/render_image'; +import { mounts, project, branch, baseUrl } from '../../mock_data'; + +describe('rich_content_editor/renderers/render_image', () => { + let renderer; + let imageRepository; + + beforeEach(() => { + renderer = imageRenderer.build(mounts, project, branch, baseUrl, imageRepository); + imageRepository = { get: () => null }; + }); + + describe('build', () => { + it('builds a renderer object containing `canRender` and `render` functions', () => { + expect(renderer).toHaveProperty('canRender', expect.any(Function)); + expect(renderer).toHaveProperty('render', expect.any(Function)); + }); + }); + + describe('canRender', () => { + it.each` + input | result + ${{ type: 'image' }} | ${true} + ${{ type: 'text' }} | ${false} + ${{ type: 'htmlBlock' }} | ${false} + `('returns $result when input is $input', ({ input, result }) => { + expect(renderer.canRender(input)).toBe(result); + }); + }); + + describe('render', () => { + let skipChildren; + let context; + let node; + + beforeEach(() => { + skipChildren = jest.fn(); + context = { skipChildren }; + node = { + firstChild: { + type: 'img', + literal: 'Some Image', + }, + }; + }); + + it.each` + destination | isAbsolute | src + ${'http://test.host/absolute/path/to/image.png'} | ${true} | ${'http://test.host/absolute/path/to/image.png'} + ${'/relative/path/to/image.png'} | ${false} | ${'http://test.host/user1/project1/-/raw/master/default/source/relative/path/to/image.png'} + ${'/target/image.png'} | ${false} | ${'http://test.host/user1/project1/-/raw/master/source/with/target/image.png'} + ${'relative/to/current/image.png'} | ${false} | ${'http://test.host/user1/project1/-/raw/master/relative/to/current/image.png'} + ${'./relative/to/current/image.png'} | ${false} | ${'http://test.host/user1/project1/-/raw/master/./relative/to/current/image.png'} + ${'../relative/to/current/image.png'} | ${false} | ${'http://test.host/user1/project1/-/raw/master/../relative/to/current/image.png'} + `('returns an image with the correct attributes', ({ destination, isAbsolute, src }) => { + node.destination = destination; + + const result = renderer.render(node, context); + + expect(result).toEqual({ + type: 'openTag', + tagName: 'img', + selfClose: true, + attributes: { + 'data-original-src': !isAbsolute ? destination : '', + src, + alt: 'Some Image', + }, + }); + + expect(skipChildren).toHaveBeenCalled(); + }); + + it('renders an image if a cached image is found in the repository, use the base64 content as the source', () => { + const imageContent = 'some-content'; + const originalSrc = 'path/to/image.png'; + + imageRepository.get = () => imageContent; + renderer = imageRenderer.build(mounts, project, branch, baseUrl, imageRepository); + node.destination = originalSrc; + + const result = renderer.render(node, context); + + expect(result).toEqual({ + type: 'openTag', + tagName: 'img', + selfClose: true, + attributes: { + 'data-original-src': originalSrc, + src: `data:image;base64,${imageContent}`, + alt: 'Some Image', + }, + }); + }); + }); +}); |