Failed to feed selector to a ClientFunction

Pre-conditions:

Page Object class

import { Selector} from "testcafe";

export class MyAccount {
  constructor() { 
    this.box = {
      item_1: Selector("#item01");
      item_2: Selector("#item02");
    }
  }
}

ClientFunction file:

import { ClientFunction } from 'testcafe';

export const scrollInto = ClientFunction((selector) => {
    var element = window.document.querySelector(selector);    
    element.scrollIntoView();
});

EXAMPLE 1. (FAILED)

import { MyAccount } from "../MyAccount";
import { scrollInto } from "../clientFunctions";

const myAccount = new MyAccount();

fixture("Feature A").page(process.env.url);

test("Test 01", async t => {

  await scrollInto(myAccount.box.item_1);

}

EXAMPLE 1. (PASSED)

import { MyAccount } from "../MyAccount";
import { scrollInto } from "../clientFunctions";

const myAccount = new MyAccount();

fixture("Feature A").page(process.env.url);

test("Test 01", async t => {

  await scrollInto("#item01");

}

Please take a look at the structure above. Is there any way to get 'Example 1' working? The idea is to avoid storing a 'css selector string' in a 'test' class.