instead of trying to access the scope, change it through an input element (verbatim)

fix-space-nbsp
Dmitri Akatov 11 years ago
parent 61c22697e6
commit fac8a4543c

@ -1,29 +1,3 @@
angular.scenario.dsl 'scope', ->
(ctrl, arg = null) ->
futureName =
if !arg?
"scope in Controller '#{ctrl}'"
else if typeof arg == 'function'
"executing 'scope.$apply(#{arg})' in Controller '#{ctrl}'"
else
"scope variable '#{arg}' in Controller '#{ctrl}'"
@addFutureAction futureName
, ($window, $document, done) ->
elmt = $window.$ "[ng-controller='#{ctrl}']"
return done("No Controller #{ctrl}") unless elmt?
sc = elmt.scope()
return done(null, sc) unless arg?
if typeof arg == 'string'
parts = arg.split '.'
for p in parts
sc = sc[p]
done(null, sc)
else if typeof arg == 'function'
sc.$apply -> arg(sc)
done()
else
done "don't understand argument #{arg}"
describe 'module contenteditable', ->
describe 'directive contenteditable', ->
describe 'simple application', ->
@ -33,22 +7,18 @@ describe 'module contenteditable', ->
it 'should update the model from the view (simple text)', ->
element('#input').enter('abc')
expect(element('#input').html()).toBe 'abc'
expect(scope('Ctrl', 'model')).toBe 'abc'
expect(element('#output').html()).toBe 'abc'
it 'should update the model from the view (text with spans)', ->
element('#input').html('abc <span style="color:red">red</span>')
expect(scope('Ctrl', 'model')).toBe 'abc <span style="color:red">red</span>'
expect(element('#input span').html()).toBe 'red'
expect(element('#output').html()).toBe 'abc &lt;span style="color:red"&gt;red&lt;/span&gt;'
it 'should update the view from the model', ->
expect(scope('Ctrl', 'model')).toBe 'Initial stuff <b>with bold</b> <em>and italic</em> yay'
scope('Ctrl', ($scope) -> $scope.model = 'oops')
expect(scope('Ctrl', 'model')).toBe 'oops'
input('model').enter('oops')
expect(element('#input').html()).toBe 'oops'
scope('Ctrl', ($scope) -> $scope.model = 'a <span style="color:red">red</span> b')
expect(element('#output').html()).toBe 'oops'
input('model').enter('a <span style="color:red">red</span> b')
expect(element('#input').html()).toBe 'a <span style="color:red">red</span> b'
expect(element('#input span').html()).toBe 'red'
## Why doesn't it work on this one??!!
# expect(element('#output').html()).toBe 'oops'
expect(element('#output').html()).toBe 'a &lt;span style="color:red"&gt;red&lt;/span&gt; b'

@ -1,9 +1,7 @@
<!DOCTYPE html>
r<!DOCTYPE html>
<html ng-app="simple">
<head>
<title>Simple</title>
<!-- we need jquery for e2e testing -->
<script src="../../bower_components/jquery/jquery.js"></script>
<script src="../../bower_components/angular-unstable/angular.js"></script>
<script src="../../angular-contenteditable.js"></script>
<script>
@ -16,26 +14,26 @@ angular.bootstrap(document, ['simple'])
</head>
<body>
<div ng-controller="Ctrl">
<label>Contenteditable (View):</label>
<div id="input" contenteditable ng-model="model">
</div>
<label>Model (non-editable):</label>
<pre id="output">{{ model }}</pre>
<hr>
<div>
<label>Model:</label>
<pre id="output" onclick="console.log('clicked the output')">{{ model }}</pre>
</div>
<label>Contenteditable View (1):</label>
<div id="input" contenteditable ng-model="model"></div>
<hr>
<div contenteditable>Edit me - I don't affect anything</div>
<hr>
<div id="i1" contenteditable="true" ng-model="model"></div>
<label>Contenteditable View (2):</label>
<div id="input2" contenteditable="true" ng-model="model"></div>
<hr>
<div id="i2" contenteditable="TRUE" ng-model="model"></div>
<label>Contenteditable View (3):</label>
<div id="input3" contenteditable="TRUE" ng-model="model"></div>
<hr>
<div id="i3" contenteditable="tRuE" ng-model="model"></div>
<label>non-contenteditable View:</label>
<div id="non-editable" contenteditable="false" ng-model="model"></div>
<hr>
<div id="i4" contenteditable="tRUe" ng-model="model"></div>
<label>Input (edit verbatim)</label>
<input ng-model="model" style="width:100%">
<hr>
<div id="i5" contenteditable="f" ng-model="model"></div>
<label>Contenteditable without Model</label>
<div contenteditable>Edit me - I don't affect anything</div>
</div>
</body>
</html>