[Feature]: Option to see if Multiple scenarios in a single feature can be grouped into one Test.describe() and fixtures to be shared across

[harishh3492]

The Problem

Scenario:
I have a Test scenario that has around 10+ test cases within it. At present, we have all 10+ test cases ( Around 40 Steps) written within the single scenario. Reason behind this is the page flow/fixture usage is the same and cannot be segregated.

Current World:
Currently each scenario is represented as test.describe() in the bddgen and each test block within the describe has a new fixture.

Challenge:
Having 40+ steps makes it very lengthy and unreadable. Would be logical to have them segregated as 10 different scenario within the feature with each scenario referring to a Test case.

Proposed Solution

Feature Request:

1. Is there a way by which we can have one test.describe for a Feature with each scenario represented as test?
2. is there a way by which the fixture (ex: page)/hooks can be shared across the test and set at the describe level?

Additional Context

I have seen a similar structure being used in protractor-based frameworks. Would be great if we can replicate it here as well.

Priority Level

High

[vitalets]

1. Is there a way by which we can have one test.describe for a Feature with each scenario represented as test?

This is how it works now. Given a feature with 2 scenarios:

Feature: Playwright Home Page

  Scenario: Check title
    Given I am on Playwright home page
    When I click link "Get started"
    Then I see in title "Installation"

  Scenario: Check title 2
    Given I am on Playwright home page
    When I click link "Get started"
    Then I see in title "Installation"

Generated test contains test.describe for feature and each scenario is transformed into test():

test.describe('Playwright Home Page', () => {

  test('Check title', async ({ Given, page, When, Then }) => { 
    await Given('I am on Playwright home page', null, { page }); 
    await When('I click link "Get started"', null, { page }); 
    await Then('I see in title "Installation"', null, { page }); 
  });

  test('Check title 2', async ({ Given, page, When, Then }) => { 
    await Given('I am on Playwright home page', null, { page }); 
    await When('I click link "Get started"', null, { page }); 
    await Then('I see in title "Installation"', null, { page }); 
  });

});

Could you provide the example to better clarify the input and the expected output?

2. is there a way by which the fixture (ex: page)/hooks can be shared across the test and set at the describe level?

Yes, it's possible. Please, check out this guide.

[harishh3492]

@vitalets The structure changes when Examples are provided.

Feature: Playwright Home Page

Scenario: Check title
Given I am on Playwright home page
When I click link ""
Then I see in title "Installation"

Examples:
| link |
| test |

Scenario: Check title 2
Given I am on Playwright home page
When I click link "Get started"
Then I see in title "Installation"

The spec.js for this post bddgen looks like

test.describe('Playwright Home Page', () => {
test.describe('Check title'', () => {
test('Example #1', async ({ Given, page, When, Then }) => {
await Given('I am on Playwright home page', null, { page });
await When('I click link "Get started"', null, { page });
await Then('I see in title "Installation"', null, { page });
});
});

test('Check title 2', async ({ Given, page, When, Then }) => {
await Given('I am on Playwright home page', null, { page });
await When('I click link "Get started"', null, { page });
await Then('I see in title "Installation"', null, { page });
});
});

Expected:

test.describe('Playwright Home Page', () => {

test('Example #1 - Check title 1', async ({ Given, page, When, Then }) => {
await Given('I am on Playwright home page', null, { page });
await When('I click link "Get started"', null, { page });
await Then('I see in title "Installation"', null, { page });
});

test('Check title 2', async ({ Given, page, When, Then }) => {
await Given('I am on Playwright home page', null, { page });
await When('I click link "Get started"', null, { page });
await Then('I see in title "Installation"', null, { page });
});

});

The reason behind this is, there will be one test.describe() representing the whole feature file.

I am yet to explore the fixture/hooks share across test / test.describe(). If hooks share across test.describe() I think that should be good for us. I will keep you update on the same thread with this.

[vitalets]

Got it, I like the idea. The resulting structure will be simpler.

The original structure with test.describe for scenario outline allows to run the whole bunch of tests with a single click in vscode plugin, but it's a minor advantage.
Anyway it should be a configurable option to be backwards compatible.

The only thing I want to define, how to generate the combined title for scenario + example. In your code you used the format (example title) - (scenario title), e.g. Example #1 - Check title. I assume some users may want to see scenario title first, e.g. Check title: Example #1. Or even Check title: #1.

There are already multiple ways to configure example title format inside test.describe block. I would like to re-use this option for combined format as well, to not introduce new one. The option examplesTitleFormat already uses <_index_> to refer to example index. I think we can introduce a new placeholder <_scenarioTitle_>, that will be replaced with the actual scenario title.

So to get the output as you shown, the hypothetical BDD config could be:

const testDir = defineBddConfig({
  examplesNoDescribe: true,
  examplesTitleFormat: `Example #<_index_> - <_scenarioTitle_>`,
});