`<wa-slider>` から無効な `required` 属性を削除

<input type="range"> に required 制約は仕様上存在しないため、<wa-slider> が誤って実装していた required 属性のサポートが削除されました。これにより、バグのあるバリデーション挙動が根本から解消されます。

背景

スライダーコンポーネントに required を追加する試みが、HTML仕様の範囲外の実装であったことが判明しました。#1471 で報告されたバグによると、required を持つスライダーを含むフォームは初回の送信試行こそブロックするものの、バリデーション違反を示すUIが何も表示されず、2回目以降の送信は通過してしまうという問題がありました。

この挙動の根本原因は、仕様にあります。<input type="range"> は常に値を持つ（デフォルト値が自動的に設定される）ため、ブラウザの制約バリデーション仕様において valueMissing 状態が定義されていません。PRの説明にある通り、スライダーが「未入力」になる状態は存在せず、required制約は range 型には適用できないのです。

誤った前提に基づくバリデーションロジックを維持し続けることは、信頼性の低いフォーム挙動につながるため、required サポートごと削除する判断が取られました。

技術的な変更

変更は slider.ts のプロパティ定義と slider-validator.ts のバリデーションロジックの2箇所に集中しており、関連するドキュメントも合わせて削除されています。

slider.ts からのプロパティ削除:

変更前:

/** Makes the slider a required field. */
@property({ type: Boolean, reflect: true }) required = false;

変更後: このプロパティ定義ごと削除。

slider-validator.ts のバリデーションロジック削除:

変更前:

// Create a native range input to get localized validation messages
const nativeRequiredRange = Object.assign(document.createElement('input'), {
  type: 'range',
  required: true,
});

return {
  observedAttributes: ['required', 'min', 'max', 'step'],
  checkValidity(element) {
    // ...
    // Check required validation first
    if (element.required && !element.hasInteracted) {
      validity.isValid = false;
      validity.invalidKeys.push('valueMissing');
      validity.message = nativeRequiredRange.validationMessage || 'Please fill out this field.';
      return validity;
    }
    // ...
  }
};

変更後:

return {
  observedAttributes: ['min', 'max', 'step'],
  checkValidity(element) {
    // required チェックなし、range/step バリデーションのみ
  }
};

ローカライズされたバリデーションメッセージを取得するために生成していた nativeRequiredRange 要素も不要になり、バリデータ全体がシンプルになっています。observedAttributes からも 'required' が削除され、不要な属性監視がなくなりました。

ドキュメント側では、slider.md の「Required」セクション（使用例のコードブロックを含む11行）が丸ごと削除され、ユーザーが誤った使い方を参照できないようになっています。

設計判断

「誤った機能を修正するのではなく、削除する」 という判断が取られています。

required 状態を擬似的にエミュレートする（例: スライダーが操作されるまで valueMissing を返し続ける）という方向性も考えられますが、PRでは「スライダーは性質上、カスタムバリデーションのみをサポートする」と明確に述べられています。仕様に存在しない required 状態を独自実装することは、ブラウザ標準との乖離を生み、今回のような不整合なUXを生み出す源泉になります。

スライダーに「入力必須」のような制約を課したいユースケースには、コンポーネントが元々サポートしているカスタムバリデーション（setCustomValidity）を使うことになります。これは Web Components のフォーム統合における正しいアプローチであり、スライダー固有の意味論に基づいた検証（例: 特定の値範囲に収まること）をアプリケーション側で定義できます。

まとめ

本PRは、仕様上存在しない制約を実装したことによるバグを、パッチではなく機能の削除によって解決した変更です。required への対応を完全に除去することで、コンポーネントをHTML仕様の範囲に正しく収め、バリデーションの信頼性を回復しています。