Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
DOM element getter component, refs #66
- Loading branch information
Showing
5 changed files
with
134 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,77 @@ | ||
if typeof process is 'object' and process.title is 'node' | ||
# TODO: Use jsdom to make DOM components work also on Node | ||
return | ||
else | ||
getelement = require 'noflo/components/GetElement.js' | ||
socket = require 'noflo/lib/InternalSocket.js' | ||
|
||
describe 'GetElement component', -> | ||
c = null | ||
ins = null | ||
selector = null | ||
element = null | ||
error = null | ||
beforeEach -> | ||
c = getelement.getComponent() | ||
ins = socket.createSocket() | ||
selector = socket.createSocket() | ||
element = socket.createSocket() | ||
error = socket.createSocket() | ||
c.inPorts.in.attach ins | ||
c.inPorts.selector.attach selector | ||
c.outPorts.element.attach element | ||
|
||
describe 'with non-matching query', -> | ||
it 'should throw an error when ERROR port is not attached', -> | ||
chai.expect(-> selector.send 'Foo').to.throw Error | ||
it 'should transmit an Error when ERROR port is attached', (done) -> | ||
error.once 'data', (data) -> | ||
chai.expect(data).to.be.an.instanceof Error | ||
done() | ||
c.outPorts.error.attach error | ||
selector.send 'Foo' | ||
|
||
describe 'with invalid query', -> | ||
it 'should throw an error when ERROR port is not attached', -> | ||
chai.expect(-> ins.send {}).to.throw Error | ||
it 'should transmit an Error when ERROR port is attached', (done) -> | ||
error.once 'data', (data) -> | ||
chai.expect(data).to.be.an.instanceof Error | ||
done() | ||
c.outPorts.error.attach error | ||
ins.send {} | ||
|
||
describe 'with invalid container', -> | ||
it 'should throw an error when ERROR port is not attached', -> | ||
chai.expect(-> ins.send {}).to.throw Error | ||
it 'should transmit an Error when ERROR port is attached', (done) -> | ||
error.once 'data', (data) -> | ||
chai.expect(data).to.be.an.instanceof Error | ||
done() | ||
c.outPorts.error.attach error | ||
ins.send {} | ||
|
||
describe 'with matching query without container', -> | ||
it 'should send the matched element to the ELEMENT port', (done) -> | ||
query = '#fixtures .getelement' | ||
el = document.querySelector query | ||
element.once 'data', (data) -> | ||
chai.expect(data.tagName).to.exist | ||
chai.expect(data.tagName).to.equal 'DIV' | ||
chai.expect(data.innerHTML).to.equal 'Foo' | ||
chai.expect(data).to.equal el | ||
done() | ||
selector.send query | ||
|
||
describe 'with matching query with container', -> | ||
it 'should send the matched element to the ELEMENT port', (done) -> | ||
container = document.querySelector '#fixtures' | ||
el = document.querySelector '#fixtures .getelement' | ||
element.once 'data', (data) -> | ||
chai.expect(data.tagName).to.exist | ||
chai.expect(data.tagName).to.equal 'DIV' | ||
chai.expect(data.innerHTML).to.equal 'Foo' | ||
chai.expect(data).to.equal el | ||
done() | ||
ins.send container | ||
selector.send '.getelement' |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,45 @@ | ||
if typeof process is 'object' and process.title is 'node' | ||
noflo = require "../../lib/NoFlo" | ||
else | ||
noflo = require '/noflo' | ||
|
||
class GetElement extends noflo.Component | ||
description: 'Get a DOM element matching a query' | ||
constructor: -> | ||
@container = null | ||
|
||
@inPorts = | ||
in: new noflo.Port 'object' | ||
selector: new noflo.Port 'string' | ||
@outPorts = | ||
element: new noflo.Port 'object' | ||
error: new noflo.Port 'object' | ||
|
||
@inPorts.in.on 'data', (data) => | ||
unless typeof data.querySelector is 'function' | ||
@error 'Given container doesn\'t support querySelectors' | ||
return | ||
@container = data | ||
|
||
@inPorts.selector.on 'data', (data) => | ||
@select data | ||
|
||
select: (selector) -> | ||
if @container | ||
el = @container.querySelector selector | ||
else | ||
el = document.querySelector selector | ||
unless el | ||
@error "No element matching '#{selector}' found" | ||
return | ||
@outPorts.element.send el | ||
@outPorts.element.disconnect() | ||
|
||
error: (msg) -> | ||
if @outPorts.error.isAttached() | ||
@outPorts.error.send new Error msg | ||
@outPorts.error.disconnect() | ||
return | ||
throw new Error msg | ||
|
||
exports.getComponent = -> new GetElement |