mirror of
https://github.com/mozilla/gecko-dev.git
synced 2025-11-09 21:00:42 +02:00
a068bbb8f1
This adds a block button to best match rows. The button looks similar to the `?` help button. For best match rows, both the block and help buttons appear, with the block button first. Figma spec, see "Top pick proposal for Firefox 99 - awesomebar": https://www.figma.com/file/seJ2ZA4v3FgoV7jCxUR74B/Firefox-Suggest?node-id=4937%3A67136 This does not handle clicks on the button because that will be covered by bug 1754591 and bug 1754594. To test this, the easiest way is still probably to pause browser_bestMatch.js. You can use the `nonsponsored()` task to test the block button by itself and `nonsponsoredHelpButton()` to test with a help button; pause before the `promisePopupClose()` at the end. If that's not practical I can post my WIP for triggering best matches and you'll need to enable Firefox Suggest too. To implement this I generalized the existing help button code into a way to add arbitrary buttons. Instead I could have duplicated it, but that's not as nice and it makes the CSS a little uglier because we'd need rules for handling the help button alone, the block button alone, and both (although there are no plans to show the block button alone). In addition, eventually we want a way to report inappropriate suggestions so there's been discussion about having a report button too. It may turn out that we add a single `...` button for everything, but it's not clear yet. I tweaked the button style a little to match the new spec. Help buttons in the usual Firefox Suggest rows will get these tweaks too of course. The help button (and block button) are now smaller, have smaller margins, and their hover background color is the same as the color for rows. Finally, I noticed we're not correctly updating `item[role]` when reusing a row and going from without a help button to with a help button, or vice versa, so this fixes that too. Differential Revision: https://phabricator.services.mozilla.com/D138508
284 lines
7.6 KiB
JavaScript
284 lines
7.6 KiB
JavaScript
/* Any copyright is dedicated to the Public Domain.
|
|
* http://creativecommons.org/publicdomain/zero/1.0/ */
|
|
|
|
// Tests keyboard selection within UrlbarUtils.RESULT_TYPE.TIP results.
|
|
|
|
"use strict";
|
|
|
|
const HELP_URL = "about:mozilla";
|
|
const TIP_URL = "about:about";
|
|
|
|
add_task(async function tipIsSecondResult() {
|
|
let results = [
|
|
new UrlbarResult(
|
|
UrlbarUtils.RESULT_TYPE.URL,
|
|
UrlbarUtils.RESULT_SOURCE.HISTORY,
|
|
{ url: "http://mozilla.org/a" }
|
|
),
|
|
new UrlbarResult(
|
|
UrlbarUtils.RESULT_TYPE.TIP,
|
|
UrlbarUtils.RESULT_SOURCE.OTHER_LOCAL,
|
|
{
|
|
icon: "",
|
|
text: "This is a test intervention.",
|
|
buttonText: "Done",
|
|
type: "test",
|
|
helpUrl: HELP_URL,
|
|
buttonUrl: TIP_URL,
|
|
}
|
|
),
|
|
];
|
|
|
|
let provider = new UrlbarTestUtils.TestProvider({ results, priority: 1 });
|
|
UrlbarProvidersManager.registerProvider(provider);
|
|
|
|
await UrlbarTestUtils.promiseAutocompleteResultPopup({
|
|
value: "test",
|
|
window,
|
|
});
|
|
|
|
Assert.equal(
|
|
UrlbarTestUtils.getResultCount(window),
|
|
2,
|
|
"There should be two results in the view."
|
|
);
|
|
let secondResult = await UrlbarTestUtils.getDetailsOfResultAt(window, 1);
|
|
Assert.equal(
|
|
secondResult.type,
|
|
UrlbarUtils.RESULT_TYPE.TIP,
|
|
"The second result should be a tip."
|
|
);
|
|
|
|
EventUtils.synthesizeKey("KEY_ArrowDown");
|
|
Assert.equal(
|
|
UrlbarTestUtils.getSelectedElementIndex(window),
|
|
0,
|
|
"The first element should be selected."
|
|
);
|
|
|
|
EventUtils.synthesizeKey("KEY_ArrowDown");
|
|
Assert.ok(
|
|
UrlbarTestUtils.getSelectedElement(window).classList.contains(
|
|
"urlbarView-tip-button"
|
|
),
|
|
"The selected element should be the tip button."
|
|
);
|
|
Assert.equal(
|
|
UrlbarTestUtils.getSelectedElementIndex(window),
|
|
1,
|
|
"The first element should be selected."
|
|
);
|
|
|
|
EventUtils.synthesizeKey("KEY_ArrowDown");
|
|
Assert.ok(
|
|
UrlbarTestUtils.getSelectedElement(window).classList.contains(
|
|
"urlbarView-button-help"
|
|
),
|
|
"The selected element should be the tip help button."
|
|
);
|
|
Assert.equal(
|
|
UrlbarTestUtils.getSelectedRowIndex(window),
|
|
1,
|
|
"getSelectedRowIndex should return 1 even though the help button is selected."
|
|
);
|
|
Assert.equal(
|
|
UrlbarTestUtils.getSelectedElementIndex(window),
|
|
2,
|
|
"The third element should be selected."
|
|
);
|
|
|
|
// If this test is running alone, the one-offs will rebuild themselves when
|
|
// the view is opened above, and they may not be visible yet. Wait for the
|
|
// first one to become visible before trying to select it.
|
|
await TestUtils.waitForCondition(() => {
|
|
return (
|
|
gURLBar.view.oneOffSearchButtons.buttons.firstElementChild &&
|
|
BrowserTestUtils.is_visible(
|
|
gURLBar.view.oneOffSearchButtons.buttons.firstElementChild
|
|
)
|
|
);
|
|
}, "Waiting for first one-off to become visible.");
|
|
|
|
EventUtils.synthesizeKey("KEY_ArrowDown");
|
|
await TestUtils.waitForCondition(() => {
|
|
return gURLBar.view.oneOffSearchButtons.selectedButton;
|
|
}, "Waiting for one-off to become selected.");
|
|
Assert.equal(
|
|
UrlbarTestUtils.getSelectedElementIndex(window),
|
|
-1,
|
|
"No results should be selected."
|
|
);
|
|
|
|
EventUtils.synthesizeKey("KEY_ArrowUp");
|
|
Assert.ok(
|
|
UrlbarTestUtils.getSelectedElement(window).classList.contains(
|
|
"urlbarView-button-help"
|
|
),
|
|
"The selected element should be the tip help button."
|
|
);
|
|
|
|
gURLBar.view.close();
|
|
UrlbarProvidersManager.unregisterProvider(provider);
|
|
});
|
|
|
|
add_task(async function tipIsOnlyResult() {
|
|
let results = [
|
|
new UrlbarResult(
|
|
UrlbarUtils.RESULT_TYPE.TIP,
|
|
UrlbarUtils.RESULT_SOURCE.OTHER_LOCAL,
|
|
{
|
|
icon: "",
|
|
text: "This is a test intervention.",
|
|
buttonText: "Done",
|
|
type: "test",
|
|
helpUrl:
|
|
"https://support.mozilla.org/en-US/kb/delete-browsing-search-download-history-firefox",
|
|
}
|
|
),
|
|
];
|
|
|
|
let provider = new UrlbarTestUtils.TestProvider({ results, priority: 1 });
|
|
UrlbarProvidersManager.registerProvider(provider);
|
|
|
|
await UrlbarTestUtils.promiseAutocompleteResultPopup({
|
|
value: "test",
|
|
window,
|
|
});
|
|
|
|
Assert.equal(
|
|
UrlbarTestUtils.getResultCount(window),
|
|
1,
|
|
"There should be one result in the view."
|
|
);
|
|
let firstResult = await UrlbarTestUtils.getDetailsOfResultAt(window, 0);
|
|
Assert.equal(
|
|
firstResult.type,
|
|
UrlbarUtils.RESULT_TYPE.TIP,
|
|
"The first and only result should be a tip."
|
|
);
|
|
|
|
EventUtils.synthesizeKey("KEY_ArrowDown");
|
|
Assert.ok(
|
|
UrlbarTestUtils.getSelectedElement(window).classList.contains(
|
|
"urlbarView-tip-button"
|
|
),
|
|
"The selected element should be the tip button."
|
|
);
|
|
Assert.equal(
|
|
UrlbarTestUtils.getSelectedElementIndex(window),
|
|
0,
|
|
"The first element should be selected."
|
|
);
|
|
|
|
EventUtils.synthesizeKey("KEY_ArrowDown");
|
|
Assert.ok(
|
|
UrlbarTestUtils.getSelectedElement(window).classList.contains(
|
|
"urlbarView-button-help"
|
|
),
|
|
"The selected element should be the tip help button."
|
|
);
|
|
Assert.equal(
|
|
UrlbarTestUtils.getSelectedElementIndex(window),
|
|
1,
|
|
"The second element should be selected."
|
|
);
|
|
|
|
EventUtils.synthesizeKey("KEY_ArrowDown");
|
|
Assert.equal(
|
|
UrlbarTestUtils.getSelectedElementIndex(window),
|
|
-1,
|
|
"There should be no selection."
|
|
);
|
|
|
|
EventUtils.synthesizeKey("KEY_ArrowUp");
|
|
Assert.ok(
|
|
UrlbarTestUtils.getSelectedElement(window).classList.contains(
|
|
"urlbarView-button-help"
|
|
),
|
|
"The selected element should be the tip help button."
|
|
);
|
|
|
|
gURLBar.view.close();
|
|
UrlbarProvidersManager.unregisterProvider(provider);
|
|
});
|
|
|
|
add_task(async function tipHasNoHelpButton() {
|
|
let results = [
|
|
new UrlbarResult(
|
|
UrlbarUtils.RESULT_TYPE.URL,
|
|
UrlbarUtils.RESULT_SOURCE.HISTORY,
|
|
{ url: "http://mozilla.org/a" }
|
|
),
|
|
new UrlbarResult(
|
|
UrlbarUtils.RESULT_TYPE.TIP,
|
|
UrlbarUtils.RESULT_SOURCE.OTHER_LOCAL,
|
|
{
|
|
icon: "",
|
|
text: "This is a test intervention.",
|
|
buttonText: "Done",
|
|
type: "test",
|
|
}
|
|
),
|
|
];
|
|
|
|
let provider = new UrlbarTestUtils.TestProvider({ results, priority: 1 });
|
|
UrlbarProvidersManager.registerProvider(provider);
|
|
|
|
await UrlbarTestUtils.promiseAutocompleteResultPopup({
|
|
value: "test",
|
|
window,
|
|
});
|
|
|
|
Assert.equal(
|
|
UrlbarTestUtils.getResultCount(window),
|
|
2,
|
|
"There should be two results in the view."
|
|
);
|
|
let secondResult = await UrlbarTestUtils.getDetailsOfResultAt(window, 1);
|
|
Assert.equal(
|
|
secondResult.type,
|
|
UrlbarUtils.RESULT_TYPE.TIP,
|
|
"The second result should be a tip."
|
|
);
|
|
|
|
EventUtils.synthesizeKey("KEY_ArrowDown");
|
|
Assert.equal(
|
|
UrlbarTestUtils.getSelectedElementIndex(window),
|
|
0,
|
|
"The first element should be selected."
|
|
);
|
|
|
|
EventUtils.synthesizeKey("KEY_ArrowDown");
|
|
Assert.ok(
|
|
UrlbarTestUtils.getSelectedElement(window).classList.contains(
|
|
"urlbarView-tip-button"
|
|
),
|
|
"The selected element should be the tip button."
|
|
);
|
|
Assert.equal(
|
|
UrlbarTestUtils.getSelectedElementIndex(window),
|
|
1,
|
|
"The first element should be selected."
|
|
);
|
|
|
|
EventUtils.synthesizeKey("KEY_ArrowDown");
|
|
await TestUtils.waitForCondition(() => {
|
|
return gURLBar.view.oneOffSearchButtons.selectedButton;
|
|
}, "Waiting for one-off to become selected.");
|
|
Assert.equal(
|
|
UrlbarTestUtils.getSelectedElementIndex(window),
|
|
-1,
|
|
"No results should be selected."
|
|
);
|
|
|
|
EventUtils.synthesizeKey("KEY_ArrowUp");
|
|
Assert.ok(
|
|
UrlbarTestUtils.getSelectedElement(window).classList.contains(
|
|
"urlbarView-tip-button"
|
|
),
|
|
"The selected element should be the tip button."
|
|
);
|
|
|
|
gURLBar.view.close();
|
|
UrlbarProvidersManager.unregisterProvider(provider);
|
|
});
|