diff --git a/cli/test/fixtures/dobetterweb/dbw_tester.html b/cli/test/fixtures/dobetterweb/dbw_tester.html
index f9937e05b8..23e0f0c797 100644
--- a/cli/test/fixtures/dobetterweb/dbw_tester.html
+++ b/cli/test/fixtures/dobetterweb/dbw_tester.html
@@ -196,7 +196,7 @@
-
+
@@ -363,8 +363,8 @@ function noRelOpenLinksTest() {
stampTemplate('noopener-links-tmpl', document.body);
}
-function passwordInputsCanBePastedIntoTest() {
- stampTemplate('password-inputs-can-be-pasted-into', document.body);
+function inputsCanBePastedIntoTest() {
+ stampTemplate('paste-preventing-inputs', document.body);
}
@@ -407,7 +407,7 @@ if (location.search === '') {
noRelOpenLinksTest();
// oldCSSFlexboxTest();
deprecationsTest();
- passwordInputsCanBePastedIntoTest();
+ inputsCanBePastedIntoTest();
isOnHttps();
noUnloadListenersTest();
} else {
@@ -442,7 +442,7 @@ if (location.search === '') {
deprecationsTest();
}
if (params.has('passwordinputs')) {
- passwordInputsCanBePastedIntoTest();
+ inputsCanBePastedIntoTest();
}
if (params.has('isonhttps')) {
isOnHttps();
diff --git a/cli/test/smokehouse/test-definitions/dobetterweb.js b/cli/test/smokehouse/test-definitions/dobetterweb.js
index becec32eb1..6b3f5fa549 100644
--- a/cli/test/smokehouse/test-definitions/dobetterweb.js
+++ b/cli/test/smokehouse/test-definitions/dobetterweb.js
@@ -341,7 +341,7 @@ const expectations = {
],
},
},
- 'password-inputs-can-be-pasted-into': {
+ 'paste-preventing-inputs': {
score: 0,
details: {
items: {
diff --git a/cli/test/smokehouse/test-definitions/offline-online-only.js b/cli/test/smokehouse/test-definitions/offline-online-only.js
index e715eb25f8..71ea75740c 100644
--- a/cli/test/smokehouse/test-definitions/offline-online-only.js
+++ b/cli/test/smokehouse/test-definitions/offline-online-only.js
@@ -50,7 +50,7 @@ const expectations = {
'render-blocking-resources': {
score: 1,
},
- 'password-inputs-can-be-pasted-into': {
+ 'paste-preventing-inputs': {
score: 1,
},
'service-worker': {
diff --git a/clients/test/lightrider/lightrider-entry-test.js b/clients/test/lightrider/lightrider-entry-test.js
index 3859e14dc0..a8c8ac5090 100644
--- a/clients/test/lightrider/lightrider-entry-test.js
+++ b/clients/test/lightrider/lightrider-entry-test.js
@@ -33,8 +33,10 @@ describe('lightrider-entry', () => {
const result = await runLighthouseInLR(mockConnection, url, {output}, {});
const parsedResult = JSON.parse(result);
- assert.strictEqual(parsedResult.runtimeError.code, connectionError.code);
- assert.ok(parsedResult.runtimeError.message.includes(connectionError.friendlyMessage));
+ expect(parsedResult.runtimeError).toMatchObject({
+ code: connectionError.code,
+ message: expect.stringContaining(connectionError.message),
+ });
});
it('returns an unknown-runtimeError LHR when lighthouse throws an unknown error', async () => {
diff --git a/core/audits/dobetterweb/password-inputs-can-be-pasted-into.js b/core/audits/dobetterweb/paste-preventing-inputs.js
similarity index 54%
rename from core/audits/dobetterweb/password-inputs-can-be-pasted-into.js
rename to core/audits/dobetterweb/paste-preventing-inputs.js
index a418006c54..cf1b9a0908 100644
--- a/core/audits/dobetterweb/password-inputs-can-be-pasted-into.js
+++ b/core/audits/dobetterweb/paste-preventing-inputs.js
@@ -1,5 +1,5 @@
/**
- * @license Copyright 2016 The Lighthouse Authors. All Rights Reserved.
+ * @license Copyright 2023 The Lighthouse Authors. All Rights Reserved.
* Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
* Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
*/
@@ -8,28 +8,29 @@ import {Audit} from '../audit.js';
import * as i18n from '../../lib/i18n/i18n.js';
const UIStrings = {
- /** Title of a Lighthouse audit that provides detail on the ability to paste into password fields. This descriptive title is shown to users when the page allows pasting of content into password fields. */
- title: 'Allows users to paste into password fields',
- /** Title of a Lighthouse audit that provides detail on the ability to paste into password fields. This descriptive title is shown to users when the page does not allow pasting of content into password fields. */
- failureTitle: 'Prevents users to paste into password fields',
- /** Description of a Lighthouse audit that tells the user why they should allow pasting of content into password fields. This is displayed after a user expands the section to see more. No character length limits. The last sentence starting with 'Learn' becomes link text to additional documentation. */
- description: 'Preventing password pasting undermines good security policy. ' +
- '[Learn more about user-friendly password fields](https://developer.chrome.com/docs/lighthouse/best-practices/password-inputs-can-be-pasted-into/).',
+ /** Title of a Lighthouse audit that provides detail on the ability to paste into input fields. This descriptive title is shown to users when the page allows pasting of content into input fields. */
+ title: 'Allows users to paste into input fields',
+ /** Title of a Lighthouse audit that provides detail on the ability to paste into input fields. This descriptive title is shown to users when the page does not allow pasting of content into input fields. */
+ failureTitle: 'Prevents users from pasting into input fields',
+ /** Description of a Lighthouse audit that tells the user why they should allow pasting of content into input fields. This is displayed after a user expands the section to see more. No character length limits. 'Learn More' becomes link text to additional documentation. */
+ description: 'Preventing input pasting is a UX anti-pattern, ' +
+ 'and undermines good security policy. ' +
+ '[Learn more about user-friendly input fields](https://developer.chrome.com/docs/lighthouse/best-practices/paste-preventing-inputs/).',
};
const str_ = i18n.createIcuMessageFn(import.meta.url, UIStrings);
-class PasswordInputsCanBePastedIntoAudit extends Audit {
+class PastePreventingInputsAudit extends Audit {
/**
* @return {LH.Audit.Meta}
*/
static get meta() {
return {
- id: 'password-inputs-can-be-pasted-into',
+ id: 'paste-preventing-inputs',
title: str_(UIStrings.title),
failureTitle: str_(UIStrings.failureTitle),
description: str_(UIStrings.description),
- requiredArtifacts: ['PasswordInputsWithPreventedPaste'],
+ requiredArtifacts: ['Inputs'],
};
}
@@ -38,14 +39,15 @@ class PasswordInputsCanBePastedIntoAudit extends Audit {
* @return {LH.Audit.Product}
*/
static audit(artifacts) {
- const passwordInputsWithPreventedPaste = artifacts.PasswordInputsWithPreventedPaste;
+ const inputsWithPreventsPaste = artifacts.Inputs.inputs.filter(input => input.preventsPaste);
/** @type {LH.Audit.Details.Table['items']} */
const items = [];
- passwordInputsWithPreventedPaste.forEach(input => {
+ inputsWithPreventsPaste.forEach(input => {
items.push({
node: Audit.makeNodeItem(input.node),
+ type: input.type,
});
});
@@ -55,11 +57,11 @@ class PasswordInputsCanBePastedIntoAudit extends Audit {
];
return {
- score: Number(passwordInputsWithPreventedPaste.length === 0),
+ score: Number(inputsWithPreventsPaste.length === 0),
details: Audit.makeTableDetails(headings, items),
};
}
}
-export default PasswordInputsCanBePastedIntoAudit;
+export default PastePreventingInputsAudit;
export {UIStrings};
diff --git a/core/config/default-config.js b/core/config/default-config.js
index 1e90b22201..709632bb41 100644
--- a/core/config/default-config.js
+++ b/core/config/default-config.js
@@ -150,7 +150,6 @@ const artifacts = {
MetaElements: '',
NetworkUserAgent: '',
OptimizedImages: '',
- PasswordInputsWithPreventedPaste: '',
ResponseCompression: '',
RobotsTxt: '',
ServiceWorker: '',
@@ -200,7 +199,6 @@ const defaultConfig = {
{id: artifacts.MetaElements, gatherer: 'meta-elements'},
{id: artifacts.NetworkUserAgent, gatherer: 'network-user-agent'},
{id: artifacts.OptimizedImages, gatherer: 'dobetterweb/optimized-images'},
- {id: artifacts.PasswordInputsWithPreventedPaste, gatherer: 'dobetterweb/password-inputs-with-prevented-paste'},
{id: artifacts.ResponseCompression, gatherer: 'dobetterweb/response-compression'},
{id: artifacts.RobotsTxt, gatherer: 'seo/robots-txt'},
{id: artifacts.ServiceWorker, gatherer: 'service-worker'},
@@ -361,7 +359,7 @@ const defaultConfig = {
'dobetterweb/no-document-write',
'dobetterweb/js-libraries',
'dobetterweb/notification-on-start',
- 'dobetterweb/password-inputs-can-be-pasted-into',
+ 'dobetterweb/paste-preventing-inputs',
'dobetterweb/uses-http2',
'dobetterweb/uses-passive-event-listeners',
'seo/meta-description',
@@ -614,7 +612,7 @@ const defaultConfig = {
{id: 'notification-on-start', weight: 1, group: 'best-practices-trust-safety'},
{id: 'csp-xss', weight: 0, group: 'best-practices-trust-safety'},
// User Experience
- {id: 'password-inputs-can-be-pasted-into', weight: 1, group: 'best-practices-ux'},
+ {id: 'paste-preventing-inputs', weight: 1, group: 'best-practices-ux'},
{id: 'image-aspect-ratio', weight: 1, group: 'best-practices-ux'},
{id: 'image-size-responsive', weight: 1, group: 'best-practices-ux'},
{id: 'preload-fonts', weight: 1, group: 'best-practices-ux'},
diff --git a/core/gather/gatherers/dobetterweb/password-inputs-with-prevented-paste.js b/core/gather/gatherers/dobetterweb/password-inputs-with-prevented-paste.js
deleted file mode 100644
index 785f25ac5e..0000000000
--- a/core/gather/gatherers/dobetterweb/password-inputs-with-prevented-paste.js
+++ /dev/null
@@ -1,49 +0,0 @@
-/**
- * @license Copyright 2017 The Lighthouse Authors. All Rights Reserved.
- * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
- * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
- */
-
-/* global document ClipboardEvent getNodeDetails */
-
-import FRGatherer from '../../base-gatherer.js';
-import {pageFunctions} from '../../../lib/page-functions.js';
-
-/**
- * @return {LH.Artifacts['PasswordInputsWithPreventedPaste']}
- */
-/* c8 ignore start */
-function findPasswordInputsWithPreventedPaste() {
- return Array.from(document.querySelectorAll('input[type="password"]'))
- .filter(passwordInput =>
- !passwordInput.dispatchEvent(
- new ClipboardEvent('paste', {cancelable: true})
- )
- )
- .map(passwordInput => ({
- // @ts-expect-error - getNodeDetails put into scope via stringification
- node: getNodeDetails(passwordInput),
- }));
-}
-/* c8 ignore stop */
-
-class PasswordInputsWithPreventedPaste extends FRGatherer {
- /** @type {LH.Gatherer.GathererMeta} */
- meta = {
- supportedModes: ['snapshot', 'navigation'],
- };
-
- /**
- * @param {LH.Gatherer.FRTransitionalContext} passContext
- * @return {Promise}
- */
- getArtifact(passContext) {
- return passContext.driver.executionContext.evaluate(findPasswordInputsWithPreventedPaste, {
- args: [],
- deps: [pageFunctions.getNodeDetails],
- });
- }
-}
-
-
-export default PasswordInputsWithPreventedPaste;
diff --git a/core/gather/gatherers/inputs.js b/core/gather/gatherers/inputs.js
index 2f004cd04b..21fb122ba1 100644
--- a/core/gather/gatherers/inputs.js
+++ b/core/gather/gatherers/inputs.js
@@ -61,6 +61,11 @@ function collectElements() {
return [...labelElToArtifact.keys()].indexOf(labelEl);
});
+ let preventsPaste;
+ if (!inputEl.readOnly) {
+ preventsPaste = !inputEl.dispatchEvent(new ClipboardEvent('paste', {cancelable: true}));
+ }
+
inputArtifacts.push({
parentFormIndex,
labelIndices,
@@ -74,6 +79,7 @@ function collectElements() {
// Requires `--enable-features=AutofillShowTypePredictions`.
prediction: inputEl.getAttribute('autofill-prediction'),
},
+ preventsPaste,
// @ts-expect-error - getNodeDetails put into scope via stringification
node: getNodeDetails(inputEl),
});
diff --git a/core/legacy/config/legacy-default-config.js b/core/legacy/config/legacy-default-config.js
index 06321c7075..dc7ade944a 100644
--- a/core/legacy/config/legacy-default-config.js
+++ b/core/legacy/config/legacy-default-config.js
@@ -59,7 +59,6 @@ legacyDefaultConfig.passes = [{
'dobetterweb/doctype',
'dobetterweb/domstats',
'dobetterweb/optimized-images',
- 'dobetterweb/password-inputs-with-prevented-paste',
'dobetterweb/response-compression',
'dobetterweb/tags-blocking-first-paint',
'seo/font-size',
diff --git a/core/test/audits/dobetterweb/password-inputs-can-be-pasted-into-test.js b/core/test/audits/dobetterweb/password-inputs-can-be-pasted-into-test.js
deleted file mode 100644
index 5c9cc30d5d..0000000000
--- a/core/test/audits/dobetterweb/password-inputs-can-be-pasted-into-test.js
+++ /dev/null
@@ -1,28 +0,0 @@
-/**
- * @license Copyright 2017 The Lighthouse Authors. All Rights Reserved.
- * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
- * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
- */
-
-import assert from 'assert/strict';
-
-import PasswordInputsCanBePastedIntoAudit from
- '../../../audits/dobetterweb/password-inputs-can-be-pasted-into.js';
-
-describe('Password inputs can be pasted into', () => {
- it('passes when there are no password inputs preventing paste', () => {
- const auditResult = PasswordInputsCanBePastedIntoAudit.audit({
- PasswordInputsWithPreventedPaste: [],
- });
- assert.equal(auditResult.score, 1);
- assert.equal(auditResult.details.items.length, 0);
- });
-
- it('fails when there are password inputs preventing paste', () => {
- const auditResult = PasswordInputsCanBePastedIntoAudit.audit({
- PasswordInputsWithPreventedPaste: [{node: {snippet: ''}}, {node: {snippet: ''}}],
- });
- assert.equal(auditResult.score, 0);
- assert.equal(auditResult.details.items.length, 2);
- });
-});
diff --git a/core/test/audits/dobetterweb/paste-preventing-inputs-test.js b/core/test/audits/dobetterweb/paste-preventing-inputs-test.js
new file mode 100644
index 0000000000..6864bf753c
--- /dev/null
+++ b/core/test/audits/dobetterweb/paste-preventing-inputs-test.js
@@ -0,0 +1,36 @@
+/**
+ * @license Copyright 2023 The Lighthouse Authors. All Rights Reserved.
+ * Licensed under the Apache License, Version 2.0 (the "License"); you may not use this file except in compliance with the License. You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
+ * Unless required by applicable law or agreed to in writing, software distributed under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. See the License for the specific language governing permissions and limitations under the License.
+ */
+
+import {strict as assert} from 'assert';
+
+import PastePreventingInputsAudit from '../../../audits/dobetterweb/paste-preventing-inputs.js';
+
+describe('Inputs can be pasted into', () => {
+ it('passes when there are no inputs preventing paste', () => {
+ const auditResult = PastePreventingInputsAudit.audit({
+ Inputs: {
+ inputs: [],
+ },
+ });
+ assert.equal(auditResult.score, 1);
+ assert.equal(auditResult.details.items.length, 0);
+ });
+
+ it('fails when there are inputs preventing paste', () => {
+ const auditResult = PastePreventingInputsAudit.audit({
+ Inputs: {
+ inputs: [
+ {node: {snippet: 'bad'}, preventsPaste: true},
+ {node: {snippet: ''}, preventsPaste: false},
+ {node: {snippet: ''}},
+ ],
+ },
+ });
+ assert.equal(auditResult.score, 0);
+ assert.equal(auditResult.details.items.length, 1);
+ assert.equal(auditResult.details.items[0].node.snippet, 'bad');
+ });
+});
diff --git a/core/test/fixtures/fraggle-rock/artifacts/step0/artifacts.json b/core/test/fixtures/fraggle-rock/artifacts/step0/artifacts.json
index bac68232cb..28f60d26c8 100644
--- a/core/test/fixtures/fraggle-rock/artifacts/step0/artifacts.json
+++ b/core/test/fixtures/fraggle-rock/artifacts/step0/artifacts.json
@@ -6,140 +6,160 @@
"entryType": "measure",
"startTime": 0,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:config:resolveArtifactsToDefns",
"entryType": "measure",
"startTime": 1,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:config:resolveNavigationsToDefns",
"entryType": "measure",
"startTime": 2,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:runner:gather",
"entryType": "measure",
"startTime": 3,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:driver:connect",
"entryType": "measure",
"startTime": 4,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:gather:getBenchmarkIndex",
"entryType": "measure",
"startTime": 5,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:gather:getVersion",
"entryType": "measure",
"startTime": 6,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:prepare:navigationMode",
"entryType": "measure",
"startTime": 7,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:prepare:navigation",
"entryType": "measure",
"startTime": 8,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:storage:clearDataForOrigin",
"entryType": "measure",
"startTime": 9,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:storage:clearBrowserCaches",
"entryType": "measure",
"startTime": 10,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:gather:prepareThrottlingAndNetwork",
"entryType": "measure",
"startTime": 11,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:driver:navigate",
"entryType": "measure",
"startTime": 12,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:computed:NetworkRecords",
"entryType": "measure",
"startTime": 13,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:gather:getInstallabilityErrors",
"entryType": "measure",
"startTime": 14,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:computed:MainResource",
"entryType": "measure",
"startTime": 15,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:gather:collectStacks",
"entryType": "measure",
"startTime": 16,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:computed:ProcessedTrace",
"entryType": "measure",
"startTime": 17,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:computed:ProcessedNavigation",
"entryType": "measure",
"startTime": 18,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
},
{
"name": "lh:computed:Responsiveness",
"entryType": "measure",
"startTime": 19,
"duration": 1,
- "detail": null
+ "detail": null,
+ "gather": true
}
],
"LighthouseRunWarnings": [],
@@ -20317,5 +20337,61 @@
}
}
},
- "BFCacheFailures": []
+ "BFCacheFailures": [],
+ "Inputs": {
+ "inputs": [
+ {
+ "parentFormIndex": 0,
+ "labelIndices": [],
+ "id": "",
+ "name": "q",
+ "type": "text",
+ "placeholder": "That's what she said",
+ "autocomplete": {
+ "property": "",
+ "attribute": null,
+ "prediction": null
+ },
+ "preventsPaste": false,
+ "node": {
+ "lhId": "1-15-INPUT",
+ "devtoolsNodePath": "1,HTML,1,BODY,0,DIV,0,DIV,5,FORM,1,INPUT",
+ "selector": "div#__next > div.flex > form.flex > input.font-daniel",
+ "boundingRect": {
+ "top": 392,
+ "bottom": 450,
+ "left": 20,
+ "right": 340,
+ "width": 320,
+ "height": 58
+ },
+ "snippet": "",
+ "nodeLabel": "div#__next > div.flex > form.flex > input.font-daniel"
+ }
+ }
+ ],
+ "forms": [
+ {
+ "id": "",
+ "name": "",
+ "autocomplete": "on",
+ "node": {
+ "lhId": "1-14-FORM",
+ "devtoolsNodePath": "1,HTML,1,BODY,0,DIV,0,DIV,5,FORM",
+ "selector": "body > div#__next > div.flex > form.flex",
+ "boundingRect": {
+ "top": 352,
+ "bottom": 526,
+ "left": 20,
+ "right": 340,
+ "width": 320,
+ "height": 174
+ },
+ "snippet": "