Mailspring/internal_packages/composer/spec/contenteditable-component-spec.cjsx
Evan Morikawa 3eba41b8d8 refactor(composer): update contenteditable functionality
Summary:
Fixes T3510
Fixes T3509
Fixes T3508
Fixes T3549

Extracted clipboard service

Remove unused style prop

Begin extracting quoted text from composer. Spec for clipboard service

Fix contenteditable specs

Begin to extract floating toolbar

Extract out DOMUtils and further extract floating toolbar

Further extracting domutils and floating toolbar

composer floating toolbar extracted

Fixes to hover and link states

Collapse adjacent ul lists

Fix outdent when deleting on a bulleted list

Fix bullet controls

Fixes to list creation and deletion

Add underline keyboard shortcut

Test Plan: manual :(

Reviewers: dillon, bengotow

Reviewed By: bengotow

Maniphest Tasks: T3508, T3509, T3510, T3549

Differential Revision: https://phab.nylas.com/D2036
2015-09-22 16:02:44 -07:00

78 lines
3 KiB
CoffeeScript

# This tests the basic Contenteditable component. For various modules of
# the contenteditable (such as selection, tooltip, quoting, etc) see the
# related test files.
#
_ = require "underscore"
fs = require 'fs'
React = require "react/addons"
ReactTestUtils = React.addons.TestUtils
ContenteditableComponent = require "../lib/contenteditable-component",
describe "ContenteditableComponent", ->
beforeEach ->
@onChange = jasmine.createSpy('onChange')
html = 'Test <strong>HTML</strong>'
@component = ReactTestUtils.renderIntoDocument(
<ContenteditableComponent html={html} onChange={@onChange}/>
)
@editableNode = React.findDOMNode(ReactTestUtils.findRenderedDOMComponentWithAttr(@component, 'contentEditable'))
describe "render", ->
it 'should render into the document', ->
expect(ReactTestUtils.isCompositeComponentWithType @component, ContenteditableComponent).toBe true
it "should include a content-editable div", ->
expect(@editableNode).toBeDefined()
describe "when the html is changed", ->
beforeEach ->
@changedHtmlWithoutQuote = 'Changed <strong>NEW 1 HTML</strong><br>'
@performEdit = (newHTML, component = @component) =>
@editableNode.innerHTML = newHTML
ReactTestUtils.Simulate.input(@editableNode, {target: {value: newHTML}})
it "should fire `props.onChange`", ->
@performEdit('Test <strong>New HTML</strong>')
expect(@onChange).toHaveBeenCalled()
# One day we may make this more efficient. For now we aggressively
# re-render because of the manual cursor positioning.
it "should fire if the html is the same", ->
expect(@onChange.callCount).toBe(0)
@performEdit(@changedHtmlWithoutQuote)
expect(@onChange.callCount).toBe(1)
@performEdit(@changedHtmlWithoutQuote)
expect(@onChange.callCount).toBe(2)
describe "pasting", ->
beforeEach ->
describe "when a file item is present", ->
beforeEach ->
@mockEvent =
preventDefault: jasmine.createSpy('preventDefault')
clipboardData:
items: [{
kind: 'file'
type: 'image/png'
getAsFile: -> new Blob(['12341352312411'], {type : 'image/png'})
}]
it "should save the image to a temporary file and call `onFilePaste`", ->
onPaste = jasmine.createSpy('onPaste')
@component = ReactTestUtils.renderIntoDocument(
<ContenteditableComponent html={''} onChange={@onChange} onFilePaste={onPaste} />
)
@editableNode = React.findDOMNode(ReactTestUtils.findRenderedDOMComponentWithAttr(@component, 'contentEditable'))
runs ->
ReactTestUtils.Simulate.paste(@editableNode, @mockEvent)
waitsFor ->
onPaste.callCount > 0
runs ->
path = require('path')
file = onPaste.mostRecentCall.args[0]
expect(path.basename(file)).toEqual('Pasted File.png')
contents = fs.readFileSync(file)
expect(contents.toString()).toEqual('12341352312411')