How can I find the exact coordinates of a moving element in a canvas?

Question

I'm building a snake game with 2 snakes, so typically, when one snake touches the other, the game should restart. However, what I have right now only checks for the entire x/y line that snake 2 is on. For example, if snake 2 were to be moving to the right/horizontally (they move infinitely because the walls are only portals that return the snake to the side they started on) and snake 2 moved up, it would eventually intercept the y line that snake 1 was moving on.Even though the snake on the left(1) isn't going to directly hit the snake on the right(2), it is about to die because it is going to cross the line that snake 2 is moving on This is how the snake was made:

var grid = 16;
var grid2 = 16;
var count = 0;
var count2= 0;

var snake2 = {
  x: 160,
  y: 160,
  
  dx: grid2,
  dy: 0,
  
  cells: [],
  
  maxCells: 4,
  
  
};

var apple2 = {
  x: 32,
  y: 320
};

var snake = {
  x: 160,
  y: 160,
  
  // snake velocity. moves one grid length every frame in either the x or y direction
  dx: grid,
  dy: 0,
  
  // keep track of all grids the snake body occupies
  cells: [],
  
  // length of the snake. grows when eating an apple
  maxCells: 4
};
//In this case the apple does not matter
var apple = {
  x: 32,
  y: 320
};

// get random whole numbers in a specific range
// @see https://stackoverflow.com/a/1527820/2124254
function getRandomInt(min, max) {
  return Math.floor(Math.random() * (max - min)) + min;
}

// game loop
function loop() {
  requestAnimationFrame(loop);

  // slow game loop to 15 fps instead of 60 (60/15 = 4)
  if (++count < 4) {
    return;
  }

  count = 0;
  context.clearRect(0,0,canvas.width,canvas.height);

  // move snake by it's velocity
  snake.x += snake.dx;
  snake.y += snake.dy;
  snake2.x += snake2.dx;
  snake2.y += snake2.dy;

  // wrap snake position horizontally on edge of screen
  if (snake.x < 0) {
    snake.x = canvas.width - grid;
  }
  else if (snake.x >= canvas.width) {
    snake.x = 0;
  }
  
  // wrap snake position vertically on edge of screen
  if (snake.y < 0) {
    snake.y = canvas.height - grid;
  }
  else if (snake.y >= canvas.height) {
    snake.y = 0;
  }
  
  if (snake2.x < 0) {
    snake2.x = canvas.width - grid;
  }
  else if (snake2.x >= canvas.width) {
    snake2.x = 0;
  }
  
  // wrap snake position vertically on edge of screen
  if (snake2.y < 0) {
    snake2.y = canvas.height - grid;
  }
  else if (snake2.y >= canvas.height) {
    snake2.y = 0;
  }

  // keep track of where snake has been. front of the array is always the head
  snake.cells.unshift({x: snake.x, y: snake.y});
  snake2.cells.unshift({x: snake2.x, y: snake2.y});

  // remove cells as we move away from them
  if (snake.cells.length > snake.maxCells) {
    snake.cells.pop();
  }
  if (snake2.cells.length > snake2.maxCells) {
    snake2.cells.pop();
  }
//Here the snake checks for collision with itself and with the 2nd snake
if (cell.x === snake.cells[i].x && cell.y === snake.cells[i].y || cell.x === snake.cells[i].x && cell.y === snake2.cells[i].y)

The beginning of the code is just to check if snake 1 crossed paths with itself/ran into itself. After the OR statement is where it checks for snake 1 intercepting snake 2.

I attempted to tweak my code so it would look for the exact coordinate the snake is moving on, like this:

if (cell.x === snake.cells[i].x && cell.y === snake.cells[i].y || cell.xy === snake.cells[i].xy && cell.xy === snake2.cells[i].xy)

I put xy to check for both coordinates to try to create one coordinate point to look for. However, this only resulted in immediate death. Does anyone have an idea of how to fix this? EDIT What else is needed?