Add end 2 end test tag creation

[jorgefilipecosta]

Description

This PR just adds an end 2 end test that tests the tag creation. It is the continuation of a process where we want to cover taxonomies with the end 2 end tests to avoid future regressions.
More taxonomy related tests will follow.

How has this been tested?

Verify the end 2 end tests pass.

[aduth]

Why use a * selector. If we're operating on the panel, couldn't we go direct to selecting the tokens?

tagsPanel.$$eval( '.components-form-token-field__token-text span:not(.screen-reader-text)', ( node ) => {

https://github.com/GoogleChrome/puppeteer/blob/master/docs/api.md#pageevalselector-pagefunction-args

Or is tagsPanel not the panel (looking at the implementation of findSidebarPanelWithTitle)? If so, what sense does that make?

[jorgefilipecosta]

Hi @aduth, findSidebarPanelWithTitle does not return the main panel content that we need here. findSidebarPanelWithTitle returns a button inside the panel that allows toggling the panel.
Here I want to query '.components-form-token-field__token-text span:not(.screen-reader-text)' inside the main tag panel.
The main tag panel is the "grandparent" of the toggle button. To the best way to evaluate something on the grandparent of an element seemed to be doing tagsPanel.$eval( '*' that will evaluate something on a node child of the element and then get the grandgrandparent of that node.
This seems like a hack I think findSidebarPanelWithTitle should probably return the main container of the panel and not the toggle button of the panel. Given that in most cases we just want the toggle button maybe we should have another util findSidebarPanelToggleButtonWithTitle that return the toggle button and will be used in most cases that currently use findSidebarPanelWithTitle.

[jorgefilipecosta]

Hi @aduth I applied the referred change. We now have two utils:
-findSidebarPanelToggleButtonWithTitle: Returns the button that when clicked toggles the sidebar panel open state. The previous findSidebarPanelWithTitle.
-findSidebarPanelWithTitle: Returns the sidebar panel itself, so test developers can then query things inside the panel. Before as the button was returned to query things we would need hacks e.g: parent.parent...

[gziolo]

This new test looks good and changes applied to the existing one make sense.

I’m wondering how we can ensure that the tests ever reach the part after permission check. It seems like it was dead code before.

[jorgefilipecosta]

Thank you for the reviews!

I’m wondering how we can ensure that the tests ever reach the part after permission check. It seems like it was dead code before.

Before we had a bug on category vs categories so yes we had a dead code problem that was fixed here.

[aduth]

I think this new test is a source of intermittent failures, even after some more recent improvements (#14219). At the moment there's a failure on #14276 which is a totally unrelated change:

FAIL packages/e2e-tests/specs/taxonomies.test.js (5.804s)
  ● Taxonomies › should be able to open the tags panel and create a new tag if the user has the right capabilities
    expect(received).toHaveLength(length)
    Expected length: 1
    Received length: 0
    Received array:  []
      141 | 
      142 | 		// The post should only contain the tag we added.
    > 143 | 		expect( tags ).toHaveLength( 1 );
          | 		               ^
      144 | 		expect( tags[ 0 ] ).toEqual( 'tag1' );
      145 | 
      146 | 		// Type something in the title so we can publish the post.
      at Object.toHaveLength (specs/taxonomies.test.js:143:18)
      at tryCatch (../../node_modules/regenerator-runtime/runtime.js:62:40)
      at Generator.invoke [as _invoke] (../../node_modules/regenerator-runtime/runtime.js:288:22)
      at Generator.prototype.(anonymous function) [as next] (../../node_modules/regenerator-runtime/runtime.js:114:21)
      at asyncGeneratorStep (specs/taxonomies.test.js:13:103)
      at _next (specs/taxonomies.test.js:15:194)

[jorgefilipecosta]

Thank you @aduth for the improvement done in #14219. I will analyze the test case again and try to find the cause of this problem.