Ability to "find" within the active view? (getActiveView)


#1

So I’ve been researching and trying to find the new way to handle atom.workspaceView.getActiveView(), but I have been unsuccessful. Not necessarily in terms of finding the view itself, but how to use find within that context.

Here’s the goal: For my package, https://atom.io/packages/tasks, I would like to set up the specs so that when simulating user actions, I am checking to see if certain tokens are set on items within the view. My previous test looked something like expect(editorView.find('.marker').length).toBe 2 where editor view was the activeView. How can I handle this now that the getActiveView is deprecated? I’ve been constantly thwarted by the shadow dom of the editor!

I imagine this has been asked and answered, but I have yet to come across an answer that helps!
Thanks!


#2

I am going to presume that you are talking about atom.views.getView(atom.workspace)
In that case, You can use find like

var View = atom.views.getView(atom.workspace)
var Results = View.querySelectorAll('body /deep/ .line')
console.log(Results.length)

#3

I tried that in the editor directly on my test view: atom.views.getView(atom.workspace).querySelectorAll('.marker') returned an empty set (even though I can view the .marker elements in the elements inspector) and even atom.views.getView(atom.workspace).querySelectorAll('body') returned an empty set. Any thoughts?

Update: Turns out that the /deep/ was the important bit and it seems like I’m getting results back. Can you explain the purpose of that?


#4

/deep/is used to query stuff within the shadow root :wink:
and instead of .marker, If you see my updated answer, I have written .line


#5

Makes sense! Thanks for the clarification!

Now here’s the issue. I tested that query in the editor when it’s open and it works! But when I use the same query in the spec, I’m getting an empty node list. The code:

describe 'Tasks', ->

  beforeEach ->
    waitsForPromise ->
      atom.workspace.open('sample.todo').then (o) -> editor = o

    runs ->
      buffer = editor.getBuffer()

    waitsForPromise ->
      atom.packages.activatePackage('tasks')

    runs ->
      View = atom.views.getView(atom.workspace)
      Results = View.querySelectorAll('body /deep/ .line')
      console.log Results.length

The goal being that, in any given test, I can affect a change with a command and make sure the result has the proper markers and grammar elements (since the grammar itself is dynamic :smile:). It’s also worth mentioning that a console log of the buffer proves that the correct file is being loaded.

Sorry if I seem totally lost! I swear it worked before! Thanks for your patience.


#6

@irrationalistic Can you come to the IRC please. My username is steelbrain and channel is #atom on FreeNode.


#7

Have you tried the jasmine.attachToDOM method to place the workspace element into the test DOM?

https://github.com/lee-dohm/indentation-indicator/blob/master/spec/indentation-indicator-spec.coffee#L7-L8


#8

That seemed to do it! My final code of

workspaceElement = atom.views.getView(atom.workspace)
jasmine.attachToDOM(workspaceElement)
console.log workspaceElement.querySelectorAll 'body /deep/ .line'

Gives me real results! Can you explain the purpose of the attaching? Does Jasmine just not have access to the DOM for some security reasons?


#9

It’s not a security thing. When testing, a DOM doesn’t exist. But for many tests it doesn’t need to. So only creating the DOM (and attaching the element to the fake DOM) when it is needed makes the tests run faster.


#10

That makes a lot of sense, thanks!