refactor!: move text-field to new base class

[web-padawan]

Description

Fixes #2220

Type of change

• Breaking change

[tomivirkki]

Needs an update to readme, otherwise lgtm

[web-padawan]

There is a failure in Firefox which can be also reproduced locally with out of memory error:

packages/vaadin-grid/test/templates.test.js:

 🚧 Browser logs:
      out of memory
      out of memory
      out of memory

 ❌ Error: done() called multiple times in hook <templates formatting "before each" hook in "formatting">; in addition, done() received error: Error: uncaught exception: out of memory (http://localhost:8000/packages/component-base/src/debounce.js:156) 

Example: https://github.com/vaadin/web-components/pull/2620/checks?check_run_id=3707687559

Related tests were introduced by vaadin/vaadin-grid@7a07299
But then that code was rewritten: vaadin/vaadin-grid@ba7e90d

I have no idea if the tests still make sense. But apparently something is wrong with the new text-field.
It could be related to usage of slots. I'm going to verify which mixins contain problematic code.

UPD: when updating vaadin-text-field to only include InputConstraintsMixin and InputSlotMixin the error doesn't happen. I will continue exploring which mixins might be causing this on Monday.

[tomivirkki]

The memory issue can be reproduced with the following test file:

import { fixtureSync } from '@vaadin/testing-helpers';
import '@vaadin/text-field/vaadin-text-field.js';

for (let i = 0; i < 50; i++) {
  describe('text-fields', () => {
    it('should not run out of memory', () => {
      fixtureSync('<vaadin-text-field></vaadin-text-field>'.repeat(10));
    });
  });
}

[sonarcloud]

Kudos, SonarCloud Quality Gate passed!   

0 Bugs
0 Vulnerabilities
0 Security Hotspots
1 Code Smell

No Coverage information
0.0% Duplication

[vaadin-bot]

This ticket/PR has been released with platform 22.0.0.alpha7 and is also targeting the upcoming stable 22.0.0 version.