Why does my JS queue only return first word instead of whole string?

Question

Why is it only dequeuing 'first' instead of 'first in line'? As you can see in the following test result the expected value is "first in line", but the received value is only "first", what is going on?

this is my queue class:

function Queue() {}

Queue.prototype.arr = [];
Queue.prototype.sz = 0;

Queue.prototype.enqueue = function(n) {
  this.sz++;
  this.arr.push(n);
}

Queue.prototype.dequeue = function() {
  if(this.sz === 0) {
  return undefined;
  }
  else if(this.sz > 0){
  this.sz--;
  return this.arr.shift();
  }
}

Queue.prototype.size = function() {
  return this.sz;
}

this is my test:

it('returns queued string', function() {
    queue.enqueue('first in line');
    expect(queue.size()).toBe(1);
    expect(queue.dequeue()).toBe('first in line');
  });

and this is the test result:

● returns queued string

    expect(received).toBe(expected) // Object.is equality

    Expected: "first in line"
    Received: "first"

      76 |     queue.enqueue('first in line');
      77 |     expect(queue.size()).toBe(1);
    > 78 |     expect(queue.dequeue()).toBe('first in line');
         |                             ^

Answer 1

Ok here's how I solved it, I rewrote it like this:

class Queue {
  constructor() {
  this.arr = [];
  this.sz = 0;
 }

enqueue(n) {
  this.sz++;
  this.arr.push(n);
}

dequeue() {
  if(this.sz === 0) {
  return undefined;
  }
  else if(this.sz > 0){
  this.sz--;
  return this.arr.shift();
  }
}

size() {
  return this.sz;
}
}