Test Case name not fully displaying when space is available

[charlieforward9]

Describe the bug

When I drag the Navigation Bar out to show more text within the test cases, I see the ellipses. This should show the entire test name.

Reproduction

describe("This is a really long test name that will surpass the length of the VSCode Testing navigator display", () => {
  it("should not show all of this text in the VSCode Testing navigator display because of a Vitest limitation", () => {
     expect(testDescriptorSizeLimit).toBe(undefined);
  });
});

Output

A view similar to the one above with two test items showing something like this

This is a really long test name tha...
   should not show all of this text in...

Version

v0.8.6

Validations

• [X] Check that you are using the latest version of the extension
• [X] Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• [X] Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• [X] The provided reproduction is a minimal reproducible example of the bug.

  ### Tasks

[sheremet-va]

This is how names are reported by Vitest, so they are generated by someone like this.

[github-actions[bot]]

Hello @charlieforward9. Please provide a minimal reproduction using a GitHub repository or StackBlitz (you can also use examples). Issues marked with needs reproduction will be closed if they have no activity within 3 days.

[charlieforward9]

@sheremet-va thank you for the response. Is it possible to change this in Vitest, it would be helpful to see the full string in the navigation bar if it were dragged to the respective width.

UPDATE: A reproduction was added to the original Issue description.

[sheremet-va]

Is it possible to change this in Vitest, it would be helpful to see the full string in the navigation bar if it were dragged to the respective width.

Vitest doesn't do anything with the name. This is something done by an external tool before the extension receives the data. I cannot reproduce it with your reproduction:

You can also see that there is no ' symbol which further proves that the name was truncated by someone else. Vitest never stringifies it.

[charlieforward9]

Im sorry, it seems I misunderstood what you originally said. This seems to be an issue with the vitest-cucumber plugin, or something else I am depending on. Thank you for clarifying.

[sheremet-va]

I managed to reproduce it with this code:

  it.each([{ key: 'should not show all of this text in the VSCode Testing navigator display because of a Vitest limitation' }])("$key", () => {
     expect(undefined).toBe(undefined);
  });

Vitest doesn't expect the full names to be used as properties there as they are treated a bit differently that if it was %s for example (which will just be replaced) - it also intentionally puts ' to signal it as a string. Adding truncateTreshold should help:

export default defineConfig({
  test: {
    chaiConfig: {
      truncateThreshold: Infinity,
    }
  },
})

But I would change how the tests are generated on cucumber side.

[charlieforward9]

@sheremet-va Thank you for the details. I will see about contributing these findings to give back to the community after getting so much support!

[charlieforward9]

https://github.com/amiceli/vitest-cucumber/pull/72 is addressing this issue.

[amiceli]

I've improved tests title in vitest-cucumber, long title are more legible now. @sheremet-va tests are sorted alphabetically ? For example When is before Then.

[charlieforward9]

I see this in my own code as well. Changing this to Sort by location does not fix it either.

[sheremet-va]

I need any kind of reproduction that uses vitest-cucumber. From what I remember, the extension sorts by location by default.

Ideally, for frameworks built on top of Vitest, I would recommend using suite.task method to define your own tasks.

[github-actions[bot]]

Hello @charlieforward9. Please provide a minimal reproduction using a GitHub repository or StackBlitz (you can also use examples). Issues marked with needs reproduction will be closed if they have no activity within 3 days.

[amiceli]

I'm creating an example repository. I finish it and give you its link.

[amiceli]

@sheremet-va You can check vitest-cucumber-example project. When I use vitest on vscode, I see Then before When for example ;).

Say me if you need more examples inside this project.

[sheremet-va]

It doesn't have information about the location (you would've seen the green arrow in this case), so it's sorted by default. I don't think this is the extension's fault.

I will fix the sorting by modifying the sortText string, but I would recommend using the official custom API for this instead of wrapping test function.

[sheremet-va]

Fixed by https://github.com/vitest-dev/vscode/commit/f282283a1273d370b479a85d184c0d95db7e42f1

[amiceli]

@sheremet-va Yes, it works on example projet ;).