From 5ff8a211544f7165f6019cdd2fea05d422655842 Mon Sep 17 00:00:00 2001 From: Daniel Smith <56164590+DanielRyanSmith@users.noreply.github.com> Date: Thu, 5 Sep 2024 20:48:59 +0000 Subject: [PATCH] OT Creation allows for the selection of WebDXFeature use counters (client-side) (#4313) * OT creation allows WebDXFeature use counters * wording change * Update chromedash-ot-creation-page.ts --- client-src/elements/chromedash-form-field.ts | 1 + .../elements/chromedash-ot-creation-page.ts | 58 +++++++++++++++++-- client-src/elements/form-field-enums.ts | 28 +++++++++ client-src/elements/form-field-specs.ts | 16 +++++ 4 files changed, 97 insertions(+), 6 deletions(-) diff --git a/client-src/elements/chromedash-form-field.ts b/client-src/elements/chromedash-form-field.ts index 0a6aae70..abc7f35b 100644 --- a/client-src/elements/chromedash-form-field.ts +++ b/client-src/elements/chromedash-form-field.ts @@ -353,6 +353,7 @@ export class ChromedashFormField extends LitElement { id="id_${this.name}_${value}" name="${fieldName}" value="${value}" + .checked="${value === fieldValue}" type="radio" required @change=${this.handleFieldUpdated} diff --git a/client-src/elements/chromedash-ot-creation-page.ts b/client-src/elements/chromedash-ot-creation-page.ts index fb584692..067344a4 100644 --- a/client-src/elements/chromedash-ot-creation-page.ts +++ b/client-src/elements/chromedash-ot-creation-page.ts @@ -1,4 +1,4 @@ -import {LitElement, css, html, nothing} from 'lit'; +import {LitElement, TemplateResult, css, html, nothing} from 'lit'; import {customElement, property, state} from 'lit/decorators.js'; import {ref} from 'lit/directives/ref.js'; import {FORM_STYLES} from '../css/forms-css.js'; @@ -6,7 +6,11 @@ import {SHARED_STYLES} from '../css/shared-css.js'; import {Feature, StageDict} from '../js-src/cs-client.js'; import './chromedash-form-field.js'; import {ORIGIN_TRIAL_CREATION_FIELDS} from './form-definition.js'; -import {OT_SETUP_STATUS_OPTIONS, VOTE_OPTIONS} from './form-field-enums.js'; +import { + OT_SETUP_STATUS_OPTIONS, + VOTE_OPTIONS, + USE_COUNTER_TYPE_WEBFEATURE, +} from './form-field-enums.js'; import {ALL_FIELDS} from './form-field-specs.js'; import { FieldInfo, @@ -24,6 +28,16 @@ export class ChromedashOTCreationPage extends LitElement { ...SHARED_STYLES, ...FORM_STYLES, css` + .choices label { + font-weight: bold; + } + .choices div { + margin-top: 1em; + } + .choices p { + margin: 0.5em 1.5em 1em; + } + #overlay { position: fixed; width: 100%; @@ -80,6 +94,8 @@ export class ChromedashOTCreationPage extends LitElement { @state() isDeprecationTrial = false; @state() + webfeatureUseCounterType: Number = USE_COUNTER_TYPE_WEBFEATURE; + @state() stage!: StageDict; connectedCallback() { @@ -109,6 +125,10 @@ export class ChromedashOTCreationPage extends LitElement { } } + handleUseCounterTypeUpdate(event) { + this.webfeatureUseCounterType = parseInt(event.detail.value); + } + fetchData() { this.loading = true; Promise.all([ @@ -324,10 +344,11 @@ export class ChromedashOTCreationPage extends LitElement { } }); } + const useCounterField = this.fieldValues.find( + fv => fv.name === 'ot_webfeature_use_counter' + ); if (this.isDeprecationTrial) { - this.fieldValues.find( - fv => fv.name === 'ot_webfeature_use_counter' - )!.touched = false; + useCounterField!.touched = false; } const featureSubmitBody = formatFeatureChanges( @@ -335,7 +356,15 @@ export class ChromedashOTCreationPage extends LitElement { this.featureId ); // We only need the single stage changes. - const stageSubmitBody = featureSubmitBody.stages[0]; + const stageSubmitBody = featureSubmitBody.stages[0] as Object; + + // Add on the appropriate use counter prefix. + const useCounterPrefix = + this.webfeatureUseCounterType === USE_COUNTER_TYPE_WEBFEATURE + ? '' + : 'WebDXFeature::'; + stageSubmitBody['ot_webfeature_use_counter'].value = + `${useCounterPrefix}${stageSubmitBody['ot_webfeature_use_counter'].value}`; this.submitting = true; window.csClient @@ -417,7 +446,24 @@ export class ChromedashOTCreationPage extends LitElement { fieldInfo.isApprovalsField || fieldInfo.name === 'ot_webfeature_use_counter'; + let additionalInfo: TemplateResult | symbol = nothing; + if (fieldInfo.name == 'ot_webfeature_use_counter') { + additionalInfo = html` + + + `; + } + return html` + ${additionalInfo} = { 3: 'High', // IMPACT_HIGH }; +export const USE_COUNTER_TYPE_WEBFEATURE = 0; +export const USE_COUNTER_TYPE_WEBDXFEATURE = 1; +export const WEBFEATURE_USE_COUNTER_TYPES: Record< + string, + [number, string, string | HTMLTemplateResult] +> = { + WEBFEATURE: [ + USE_COUNTER_TYPE_WEBFEATURE, + 'WebFeature', + html`The feature's use counter has been added to + web_feature.mojom.`, + ], + WEBDXFEATURE: [ + USE_COUNTER_TYPE_WEBDXFEATURE, + 'WebDXFeature', + html`The feature's use counter has been added to + webdx_feature.mojom.`, + ], +}; + // FEATURE_TYPES object is organized as [intValue, stringLabel, description], // the descriptions are used only for the descriptions of feature_type_radio_group export const FEATURE_TYPES_WITHOUT_ENTERPRISE: Record< diff --git a/client-src/elements/form-field-specs.ts b/client-src/elements/form-field-specs.ts index 52aa617b..f9ec1c82 100644 --- a/client-src/elements/form-field-specs.ts +++ b/client-src/elements/form-field-specs.ts @@ -21,6 +21,7 @@ import { VENDOR_VIEWS_COMMON, VENDOR_VIEWS_GECKO, WEB_DEV_VIEWS, + WEBFEATURE_USE_COUNTER_TYPES, } from './form-field-enums'; import {unambiguousStageName} from './utils'; @@ -1519,13 +1520,28 @@ export const ALL_FIELDS: Record = { label: 'WebFeature UseCounter name', help_text: html` For measuring usage, this must be a single named value from the WebFeature enum, e.g. kWorkerStart. The use counter must be landed in + either web_feature.mojom + or + webdx_feature.mojom. Not required for deprecation trials.`, }, + ot_webfeature_use_counter__type: { + type: 'radios', + label: 'Use counter type', + choices: WEBFEATURE_USE_COUNTER_TYPES, + help_text: html`Which type of use counter the feature is using. This can be + determined by which file the use counter is defined in.`, + }, + ot_require_approvals: { type: 'checkbox', initial: false,