yujunjun/playwright
1
0
Fork 0
mirror of https://github.com/microsoft/playwright.git synced 2025-06-26 21:40:17 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore: flag text mismatch when editing (#28106)

Browse Source
This commit is contained in:
Pavel Feldman 2023-11-13 11:44:06 -08:00 committed by GitHub
parent 40b8df7217
commit db38f0d2df
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 15 additions and 7 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
packages/playwright-core/src/server/injected/highlight.css
View File

@ -223,10 +223,11 @@ textarea.text-editor {
border: none;
margin: 10px;
color: #333;
outline: 1px solid transparent !important;
}
textarea.text-editor:focus {
outline: none;
textarea.text-editor.does-not-match {
outline: 1px solid red !important;
}
x-div {

17
packages/playwright-core/src/server/injected/recorder.ts
View File

@ -22,6 +22,7 @@ import type { Mode, OverlayState, UIState } from '@recorder/recorderTypes';
import { Highlight, type HighlightOptions } from '../injected/highlight';
import { isInsideScope } from './domUtils';
import { elementText } from './selectorUtils';
import type { ElementText } from './selectorUtils';
import { asLocator } from '../../utils/isomorphic/locatorGenerators';
import type { Language } from '../../utils/isomorphic/locatorGenerators';
import { locatorOrSelectorAsSelector } from '@isomorphic/locatorParser';
@ -467,6 +468,7 @@ class TextAssertionTool implements RecorderTool {
private _acceptButton: HTMLElement;
private _cancelButton: HTMLElement;
private _keyboardListener: ((event: KeyboardEvent) => void) | undefined;
private _textCache = new Map<Element | ShadowRoot, ElementText>();
constructor(private _recorder: Recorder) {
this._acceptButton = this._recorder.document.createElement('x-pw-tool-item');
@ -514,6 +516,7 @@ class TextAssertionTool implements RecorderTool {
}
private _generateAction(): actions.AssertAction | null {
this._textCache.clear();
const target = this._hoverHighlight?.elements[0];
if (!target)
return null;
@ -541,7 +544,7 @@ class TextAssertionTool implements RecorderTool {
name: 'assertText',
selector,
signals: [],
text: target.textContent!,
text: normalizeWhiteSpace(elementText(this._textCache, target).full),
substring: true,
};
}
@ -626,12 +629,16 @@ class TextAssertionTool implements RecorderTool {
textElement.classList.add('text-editor');
textElement.addEventListener('input', () => {
if (this._action?.name === 'assertText')
this._action.text = normalizeWhiteSpace(elementText(new Map(), textElement).full);
if (this._action?.name === 'assertChecked')
if (this._action?.name === 'assertText') {
const newValue = normalizeWhiteSpace(textElement.value);
this._action.text = newValue;
const targetText = normalizeWhiteSpace(elementText(this._textCache, target).full);
textElement.classList.toggle('does-not-match', !!newValue && !targetText.includes(newValue));
} else if (this._action?.name === 'assertChecked') {
this._action.checked = textElement.value === 'true';
if (this._action?.name === 'assertValue')
} else if (this._action?.name === 'assertValue') {
this._action.value = textElement.value;
}
});
bodyElement.appendChild(textElement);
elementToFocus = textElement;