title: How to mock d3.select.selectall with sinon?
body: <p>I have the following code that I need to test: </p>
  
  <pre><code>window.d3.select(id).selectAll("text").attr("font-family", "FontAwesome"); 
  
  var textsSelected = window.d3.select(id).selectAll('text');
  
  var filtered = textsSelected.filter(function(value, index, arr) {
      return !((value===undefined)||(typeof (value) === "number"));
  });
  </code></pre>
  
  <p>I am struggling to be able to mock it so both lines are run without it crashing with an error.</p>
  
  <p>Currently I have</p>
  
  <pre><code>var texts = {
      _group:[
          [{id: "textID2#StatusChangeChart",
             textContent: " New", 
             __data__: "hi"
              }]
          ],
      fontFamily: "shouldChange",
      __proto__:{
          attr: function (name, value) {
              if (name === 'font-family') {
                  // this works
                  this.fontFamily = value;
              }
          }
      }
  
  };
  
  
  var d3Select = sinon.stub(window.d3,'select');
  
   d3Select.withArgs("#testUpdateImage").returns({
      selectAll: function (e) {
  
          var objectToReturn = imageUpdateGroups;
  
          switch (e) {
             //stuff here
              case "text":
                  objectToReturn = texts;
  
                  //TODO
                  break;
  
             //stuff here
  
          }
          return objectToReturn;
      }
  });
  </code></pre>
  
  <p>as the mock.</p>
  
  <p>I get the error <code>TypeError: array.filter is not a function</code> and my console.log statements show the attr does change as it should.</p>
  
  <p><em>What is textsSelected supposed to be?</em></p>
  
  <p>Typing <code>window.d3.select('#PhaseChangeChart').selectAll('text');</code> into the console returns (groups has been expanded for visual purposes):</p>
  
  <pre><code>Ct {_groups: Array(1), _parents: Array(1)}
    _groups: Array(1)
         0: NodeList(48) [text, text, text, text, text, text, text, text, 
                      text, text, text, text, text, text, text, text, text, 
                      text, text, text, text, text, text, text, text, text, 
                      text, text, text, text, text, text, text, text, text, 
                      text, text, text, text, text, text, text, text, text, 
                       text, text, text, text]
         length: 1
         __proto__: Array(0)
     _parents: [svg#PhaseChangeChart]
     __proto__: Object
  </code></pre>
  
  <p>where each <code>text</code> is a text element.</p>