UNPKG

@freedom-editor/svelte-code-block

Version:
412 lines (374 loc) 10.9 kB
'use strict'; function noop() { } function run(fn) { return fn(); } function blank_object() { return Object.create(null); } function run_all(fns) { fns.forEach(run); } function is_function(thing) { return typeof thing === 'function'; } function safe_not_equal(a, b) { return a != a ? b == b : a !== b || ((a && typeof a === 'object') || typeof a === 'function'); } function append(target, node) { target.appendChild(node); } function insert(target, node, anchor) { target.insertBefore(node, anchor || null); } function detach(node) { node.parentNode.removeChild(node); } function element(name) { return document.createElement(name); } function text(data) { return document.createTextNode(data); } function attr(node, attribute, value) { if (value == null) node.removeAttribute(attribute); else if (node.getAttribute(attribute) !== value) node.setAttribute(attribute, value); } function children(element) { return Array.from(element.childNodes); } function set_data(text, data) { data = '' + data; if (text.wholeText !== data) text.data = data; } let current_component; function set_current_component(component) { current_component = component; } const dirty_components = []; const binding_callbacks = []; const render_callbacks = []; const flush_callbacks = []; const resolved_promise = Promise.resolve(); let update_scheduled = false; function schedule_update() { if (!update_scheduled) { update_scheduled = true; resolved_promise.then(flush); } } function add_render_callback(fn) { render_callbacks.push(fn); } let flushing = false; const seen_callbacks = new Set(); function flush() { if (flushing) return; flushing = true; do { // first, call beforeUpdate functions // and update components for (let i = 0; i < dirty_components.length; i += 1) { const component = dirty_components[i]; set_current_component(component); update(component.$$); } dirty_components.length = 0; while (binding_callbacks.length) binding_callbacks.pop()(); // then, once components are updated, call // afterUpdate functions. This may cause // subsequent updates... for (let i = 0; i < render_callbacks.length; i += 1) { const callback = render_callbacks[i]; if (!seen_callbacks.has(callback)) { // ...so guard against infinite loops seen_callbacks.add(callback); callback(); } } render_callbacks.length = 0; } while (dirty_components.length); while (flush_callbacks.length) { flush_callbacks.pop()(); } update_scheduled = false; flushing = false; seen_callbacks.clear(); } function update($$) { if ($$.fragment !== null) { $$.update(); run_all($$.before_update); const dirty = $$.dirty; $$.dirty = [-1]; $$.fragment && $$.fragment.p($$.ctx, dirty); $$.after_update.forEach(add_render_callback); } } const outroing = new Set(); function transition_in(block, local) { if (block && block.i) { outroing.delete(block); block.i(local); } } function mount_component(component, target, anchor) { const { fragment, on_mount, on_destroy, after_update } = component.$$; fragment && fragment.m(target, anchor); // onMount happens before the initial afterUpdate add_render_callback(() => { const new_on_destroy = on_mount.map(run).filter(is_function); if (on_destroy) { on_destroy.push(...new_on_destroy); } else { // Edge case - component was destroyed immediately, // most likely as a result of a binding initialising run_all(new_on_destroy); } component.$$.on_mount = []; }); after_update.forEach(add_render_callback); } function destroy_component(component, detaching) { const $$ = component.$$; if ($$.fragment !== null) { run_all($$.on_destroy); $$.fragment && $$.fragment.d(detaching); // TODO null out other refs, including component.$$ (but need to // preserve final state?) $$.on_destroy = $$.fragment = null; $$.ctx = []; } } function make_dirty(component, i) { if (component.$$.dirty[0] === -1) { dirty_components.push(component); schedule_update(); component.$$.dirty.fill(0); } component.$$.dirty[(i / 31) | 0] |= (1 << (i % 31)); } function init(component, options, instance, create_fragment, not_equal, props, dirty = [-1]) { const parent_component = current_component; set_current_component(component); const prop_values = options.props || {}; const $$ = component.$$ = { fragment: null, ctx: null, // state props, update: noop, not_equal, bound: blank_object(), // lifecycle on_mount: [], on_destroy: [], before_update: [], after_update: [], context: new Map(parent_component ? parent_component.$$.context : []), // everything else callbacks: blank_object(), dirty }; let ready = false; $$.ctx = instance ? instance(component, prop_values, (i, ret, ...rest) => { const value = rest.length ? rest[0] : ret; if ($$.ctx && not_equal($$.ctx[i], $$.ctx[i] = value)) { if ($$.bound[i]) $$.bound[i](value); if (ready) make_dirty(component, i); } return ret; }) : []; $$.update(); ready = true; run_all($$.before_update); // `false` as a special case of no DOM component $$.fragment = create_fragment ? create_fragment($$.ctx) : false; if (options.target) { if (options.hydrate) { const nodes = children(options.target); // eslint-disable-next-line @typescript-eslint/no-non-null-assertion $$.fragment && $$.fragment.l(nodes); nodes.forEach(detach); } else { // eslint-disable-next-line @typescript-eslint/no-non-null-assertion $$.fragment && $$.fragment.c(); } if (options.intro) transition_in(component.$$.fragment); mount_component(component, options.target, options.anchor); flush(); } set_current_component(parent_component); } class SvelteComponent { $destroy() { destroy_component(this, 1); this.$destroy = noop; } $on(type, callback) { const callbacks = (this.$$.callbacks[type] || (this.$$.callbacks[type] = [])); callbacks.push(callback); return () => { const index = callbacks.indexOf(callback); if (index !== -1) callbacks.splice(index, 1); }; } $set() { // overridden by instance, if it has props } } const getSavedData = (savedData) => { if (savedData) { return savedData.data.code } return '' }; var helper = { getSavedData }; /* src/components/CodeBlock.svelte generated by Svelte v3.24.0 */ function create_fragment(ctx) { let pre; let code; let t_value = helper.getSavedData(/*savedData*/ ctx[0]) + ""; let t; return { c() { pre = element("pre"); code = element("code"); t = text(t_value); attr(code, "contenteditable", ""); }, m(target, anchor) { insert(target, pre, anchor); append(pre, code); append(code, t); }, p(ctx, [dirty]) { if (dirty & /*savedData*/ 1 && t_value !== (t_value = helper.getSavedData(/*savedData*/ ctx[0]) + "")) set_data(t, t_value); }, i: noop, o: noop, d(detaching) { if (detaching) detach(pre); } }; } function instance($$self, $$props, $$invalidate) { let { i18n } = $$props, { savedData } = $$props; $$self.$set = $$props => { if ("i18n" in $$props) $$invalidate(1, i18n = $$props.i18n); if ("savedData" in $$props) $$invalidate(0, savedData = $$props.savedData); }; return [savedData, i18n]; } class CodeBlock extends SvelteComponent { constructor(options) { super(); init(this, options, instance, create_fragment, safe_not_equal, { i18n: 1, savedData: 0 }); } } var CodeBlock$1 = /*#__PURE__*/Object.freeze({ __proto__: null, 'default': CodeBlock }); function getCjsExportFromNamespace (n) { return n && n['default'] || n; } var CodeBlock$2 = getCjsExportFromNamespace(CodeBlock$1); class Code { constructor (customOptions) { const defaultOptions = { i18n: { locale: 'en-US', rtl: 'ltr', translations: { } }, controllers: [ ] }; this.options = { ...defaultOptions, ...customOptions }; } render (i18n, savedData) { const blockContainer = document.createElement('div'); blockContainer.classList.add('freedom-editor-blocks', `${this.constructor.name}-block`); blockContainer.dataset.blockType = this.constructor.name; const codeBlock = new CodeBlock$2({ target: blockContainer, props: { i18n: i18n, savedData: savedData } }); return blockContainer } save (block) { const codeField = block.querySelector('code'); if (codeField.textContent === '') { return } return { type: this.constructor.name, data: { code: codeField.textContent } } } } var src = { Code }; const jsdom = require('jsdom'); const { JSDOM } = jsdom; const dom = new JSDOM('<html><body></body></html>'); global.document = dom.window.document; global.window = dom.window; global.navigator = dom.window.navigator; describe('Test block essential functionalities:', () => { const codeBlock = new src.Code(); const i18n = { locale: 'en-US', rtl: 'auto' }; it('render() should return an node', () => { expect(codeBlock.render(i18n)).toHaveClass('freedom-editor-blocks'); }); it('render() should return an node with content, when passing in data', () => { const blockData = { type: codeBlock.constructor.name, data: { code: 'Testing' } }; const renderedBlock = codeBlock.render(i18n, blockData); expect(renderedBlock.querySelector('code').textContent).toContain(blockData.data.code); }); it('save() should return null when the block is empty', () => { const block = codeBlock.render(i18n); expect(codeBlock.save(block)).nothing(); }); it('save() should return JSON when the block is not empty', () => { const block = codeBlock.render(i18n); const codeField = block.querySelector('code'); codeField.textContent = 'Testing'; expect(codeBlock.save(block)).toBeTruthy(); }); }); //# sourceMappingURL=bundle-tests.js.map