How to Assert a array contains a sub string in JavaScript/TScript

Question

I am trying to check a SubString exists in an array. In the Test i am asserting using:

expect(classList).toContain('Rail__focused')

I am getting the following error:

Error: expect(received).toContain(expected // indexOf
Expected value: "Rail__focused"
Received array: ["Rail__item__3NvGX", "Rail__focused__3bGTR", "Tile__tile__3jJYQ", "Tile__wide__1GuVb", "Tile__animated__3H87p", "Tile__active__1mtVd"]

This is what I wanted to achieve and wanted this to pass

var arr = ["Rail__item__3NvGX", "Rail__focused__3bGTR", "Tile__tile__3jJYQ", "Tile__wide__1GuVb", "Tile__animated__3H87p", "Tile__active__1mtVd"];
 
var str =  'Rail__focused';
for (var i = 0, len = arr.length; i < len; ++i) {
    if (str.indexOf(arr[i]) != -1) {
        console.log("This is a pass")
    } else {
    console.log("This is a fail")
    }
}

Ludie

You haven't told us which assertion library you're using – Neurath

@Neurath added the screenshot of assert types – Ludie

You could write your own function that does the checking and returns a bool and use a truthiness assertion instead – Informality

@Ludie The screenshot doesn't help us much. Give the name of the assertion library, please – Sherl

You should share reproducable code instead of images – Spile

Answer 1

So because there is a Jest d.ts in the screenshot - I just assume that this is Jest :)

.contain does a strict === check - so this will not work with partial strings.

You could, for example, search for the item in the array and assert that it exists:

test('contain', () => {
  const classList = [
    'Rail__item__3NvGX',
    'Rail__focused__3bGTR',
    'Tile__tile__3jJYQ',
    'Tile__wide__1GuVb',
    'Tile__animated__3H87p',
    'Tile__active__1mtVd',
  ];
  expect(classList.find((el) => el.includes('Rail__focused'))).toBeDefined();
});

Array.find will return the first element that satisfies the callback result. It will return undefined - if nothing is found.

If this is a repeating task - you can write a custom matcher in Jest:

expect.extend({
  toPartiallyContain(received, needle) {
    const pass = received.find((el) => el.includes(needle));
    if (pass) {
      return {
        message: () =>
          `expected ${received} not to partially contain ${needle}`,
        pass: true,
      };
    } else {
      return {
        message: () => `expected ${received} to partially contain ${needle}`,
        pass: false,
      };
    }
  },
});

test('contain with custom matcher', () => {
  const classList = [
    'Rail__item__3NvGX',
    'Rail__focused__3bGTR',
    'Tile__tile__3jJYQ',
    'Tile__wide__1GuVb',
    'Tile__animated__3H87p',
    'Tile__active__1mtVd',
  ];
  expect(classList).toPartiallyContain('Rail__focused');
  expect(classList).not.toPartiallyContain('Hello');
});

Your example without a test assertion:

var arr = ["Rail__item__3NvGX", "Rail__focused__3bGTR", "Tile__tile__3jJYQ", "Tile__wide__1GuVb", "Tile__animated__3H87p", "Tile__active__1mtVd"];
 
var str =  'Rail__focused';

console.log(arr.find((el) => el.includes(str)));
   

Ragtime

Thanks and have updated my question with the code snippet – Ludie

I am getting Property find' does not exist on type 'string | number | boolean | object'. Property 'find' does not exist on type 'string'.ts(2339) when I use find ^^^ – Ludie

@Ludie Then you are not using it on an array ;). I updated my answer with your example code. – Ragtime

excellent @madflow. this worked const allRailItems = $$(this.selectors.railItem); const classList: any = allRailItems[railItemPosition].getProperty('classList'); const expected_focus_string = 'Rail__focused'; const expected_active_string = 'Tile__active' expect(classList.find((el) => el.includes(expected_focus_string))).toBeDefined(); expect(classList.find((el) => el.includes(expected_active_string))).toBeDefined(); return this; – Ludie