[annotator-dev] annotator 2 (master) / no ownerDocument exception

Mon Jan 26 14:48:53 UTC 2015

Hey Andrew,

TextSelector is assuming element is a pure DOM element (not a jQuery/jqLite
object), so if you change your code as follows, you should be fine:

```
var region = document.querySelector( '#regionToAnnotateId' );
$scope.annotator = new Annotator(region);
```

`.ownerDocument` is property of the DOM Node returned by `.querySelector()`
so TextSelector can do the right thing.

Cheers,
Benjamin

On Sat, Jan 24, 2015 at 8:47 AM, andrew simpson <andrew10961 at gmail.com>
wrote:

>
> I'm trying to move to annotator 2 (master branch), but am running into a
> javascript exception, below
>
> You created an instance of the TextSelector on an element that doesn't
> have an ownerDocument. This won't work! Please ensure the element is added
> to the DOM before the plugin is configured: Object[div#regionToAnnotateId
> .regionToAnnotateClass.ng-scope]
>
> I can see the logic that generates this error in:
>
> src/ui/textselector.js
>
> // TextSelector monitors a document (or a specific element) for text
> selections
> // and can notify another object of a selection event
> function TextSelector(element, options) {
>     this.element = element;
>     this.options = $.extend(true, {}, TextSelector.options, options);
>     this.onSelection = this.options.onSelection;
>
>     if (typeof this.element.ownerDocument !== 'undefined' &&
>         this.element.ownerDocument !== null) {
>         var self = this;
>         this.document = this.element.ownerDocument;
>
>         $(this.document.body)
>             .on("mouseup." + TEXTSELECTOR_NS, function (e) {
>                 self._checkForEndSelection(e);
>             });
>     } else {
>         console.warn("You created an instance of the TextSelector on an " +
>                      "element that doesn't have an ownerDocument. This
> won't " +
>                      "work! Please ensure the element is added to the DOM
> " +
>                      "before the plugin is configured:", this.element);
>     }
> }
>
> I'm using angularjs 1.2
>
> I create the annotator like this in a controller
>
> var region = angular.element( document.querySelector(
> '#regionToAnnotateId' ));
> $scope.annotator = new Annotator(region);
>
> And define region like this
>
> <div id="regionToAnnotateId" class="regionToAnnotateClass">
>     <div class="editAreaClass" id="editAreaId"
> contenteditable="{{isContentEditable()}}" ng-show="isContentAvailable()"
> ng-blur="updateContent($event)">
>         <div ng-bind-html="getContent()"></div>
>     </div>
> </div>
>
>
> When I work with annotator 1.2.x versions of these files I don't have this
> problem..
>
> annotator.min.css
> annotator-full.min.js
>
> Any ideas how to interpret this error?
>
> Thanks
>
>
>
> _______________________________________________
> annotator-dev mailing list
> annotator-dev at lists.okfn.org
> https://lists.okfn.org/mailman/listinfo/annotator-dev
> Unsubscribe: https://lists.okfn.org/mailman/options/annotator-dev
>
>
-------------- next part --------------
An HTML attachment was scrubbed...
URL: <http://lists.okfn.org/pipermail/annotator-dev/attachments/20150126/f4b9508a/attachment-0004.html>