Merge branch 'main' into add-navigator-clipboard-clipboarditem

Author: keithamus

.github/setup/action.yml renamed to .github/actions/setup/action.yml

@@ -486,14 +486,14 @@ <h1>GitHub Feature Support Table</h1>
           </tr>
           <tr>
             <th>
-              <a href="https://chromestatus.com/feature/5768400507764736">
+              <a href="https://developer.mozilla.org/docs/Web/API/AbortSignal/timeout">
                 <code>AbortSignal.timeout</code>
               </a>
             </th>
             <td data-polyfill="abortSignalTimeout"><div>*</div></td>
             <td data-supported="false"><div>*</div></td>
             <td data-supported="false"><div>*</div></td>
-            <td data-supported="false"><div>*</div></td>
+            <td data-supported="true"><div>100+</div></td>
             <td data-supported="false"><div>*</div></td>
             <td data-supported="false"><div>*</div></td>
             <td data-supported="false"><div>*</div></td>
@@ -596,6 +596,20 @@ <h1>GitHub Feature Support Table</h1>
             <td data-supported="true"><div>63+ †</div></td>
             <td data-supported="true"><div>12.0+ †</div></td>
           </tr>
+          <tr>
+            <th>
+              <a href="https://developer.mozilla.org/docs/Web/API/HTMLFormElement/requestSubmit">
+                <code>HTMLFormElement.requestSubmit</code>
+              </a>
+            </th>
+            <td data-polyfill="formRequestSubmit"><div>*</div></td>
+            <td data-supported="true"><div>76+</div></td>
+            <td data-supported="true"><div>79+</div></td>
+            <td data-supported="true"><div>75+</div></td>
+            <td data-supported="false"<div>*</div></td>
+            <td data-supported="true"><div>63+</div></td>
+            <td data-supported="true"><div>12.0+</div></td>
+          </tr>
           <tr>
             <th>
               <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwn">
@@ -737,14 +751,13 @@ <h1>GitHub Feature Support Table</h1>
             <td data-supported="true"><div>53+</div></td>
             <td data-supported="true"><div>9.0+</div></td>
           </tr>
-          <tr data-transpiled><th></th><th colspan="7"><h3>Transpiled Native Syntax</h3></th></tr>
           <tr>
             <th>
               <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Optional_chaining">
                 <code>Optional Chaining Operator (?.)</code>
               </a>
             </th>
-            <td data-code="window?.foo?.bar?.baz || true"><div>**</div></td>
+            <td data-code="window?.foo?.bar?.baz || true"><div>!</div></td>
             <td data-supported="true"><div>80+</div></td>
             <td data-supported="true"><div>80+</div></td>
             <td data-supported="true"><div>74+</div></td>
@@ -758,14 +771,15 @@ <h1>GitHub Feature Support Table</h1>
                 <code>Nullish Coalescing Operator (??)</code>
               </a>
             </th>
-            <td data-code="window.foo ?? true"><div>**</div></td>
+            <td data-code="window.foo ?? true"><div>!</div></td>
             <td data-supported="true"><div>80+</div></td>
             <td data-supported="true"><div>80+</div></td>
             <td data-supported="true"><div>72+</div></td>
             <td data-supported="true"><div>13.1+</div></td>
             <td data-supported="true"><div>67+</div></td>
             <td data-supported="true"><div>13.0+</div></td>
           </tr>
+          <tr data-transpiled><th></th><th colspan="7"><h3>Transpiled Native Syntax</h3></th></tr>
           <tr>
             <th>
               <a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Logical_nullish_assignment">
@@ -886,6 +900,7 @@ <h1>GitHub Feature Support Table</h1>
         }
         Promise.resolve(supported).then((value) => {
           el.setAttribute('data-supported', Boolean(value))
+          if (value) el.querySelector('div').textContent = ''
         })
       }
       for(const el of document.querySelectorAll('[data-polyfill]')) {

docs/index.html

@@ -1,6 +1,6 @@
 {
   "name": "@github/browser-support",
-  "version": "1.1.2",
+  "version": "1.2.2",
   "description": "Polyfills and Capable Browser detection",
   "homepage": "https://github.github.io/browser-support",
   "bugs": {
@@ -47,6 +47,6 @@
     "karma-mocha-reporter": "^2.2.5",
     "mocha": "^9.2.0",
     "tslib": "^2.1.0",
-    "typescript": "^4.2.2"
+    "typescript": "^4.7.4"
   }
 }

package-lock.json

@@ -1,6 +1,6 @@
 export class AggregateError extends Error {
   declare errors: unknown[]
-  declare cause: unknown
+  declare cause: Error | undefined
 
   constructor(errors: unknown[], message: string, options: {cause?: unknown} = {}) {
     super(message)

package.json

@@ -0,0 +1,32 @@
+export function requestSubmit(
+  this: HTMLFormElement,
+  submitter: HTMLButtonElement | HTMLInputElement | null = null
+): void {
+  const event = new SubmitEvent('submit', {bubbles: true, cancelable: true, submitter})
+  let input
+  if (submitter && submitter.name) {
+    input = Object.assign(document.createElement('input'), {
+      type: 'hidden',
+      hidden: true,
+      name: submitter.name,
+      value: submitter.value
+    })
+    this.append(input)
+  }
+  this.checkValidity() && !this.dispatchEvent(event) && this.submit()
+  input?.remove()
+}
+
+export function isSupported(): boolean {
+  return 'requestSubmit' in HTMLFormElement.prototype && typeof HTMLFormElement.prototype.requestSubmit === 'function'
+}
+
+export function isPolyfilled(): boolean {
+  return HTMLFormElement.prototype.requestSubmit === requestSubmit
+}
+
+export function apply(): void {
+  if (!isSupported()) {
+    HTMLFormElement.prototype.requestSubmit = requestSubmit
+  }
+}

src/aggregateerror.ts

@@ -7,6 +7,7 @@ import * as cryptoRandomUUID from './crypto-randomuuid.js'
 import * as elementReplaceChildren from './element-replacechildren.js'
 import * as eventAbortSignal from './event-abortsignal.js'
 import * as navigatorClipboard from './navigator-clipboard.js'
+import * as formRequestSubmit from './form-requestsubmit.js'
 import * as objectHasOwn from './object-hasown.js'
 import * as promiseAllSettled from './promise-allsettled.js'
 import * as promiseAny from './promise-any.js'
@@ -64,6 +65,7 @@ export const polyfills = {
   elementReplaceChildren,
   eventAbortSignal,
   navigatorClipboard,
+  formRequestSubmit,
   objectHasOwn,
   promiseAllSettled,
   promiseAny,
@@ -72,18 +74,11 @@ export const polyfills = {
 }
 
 export function isSupported() {
-  return (
-    baseSupport &&
-    Object.values(polyfills).every(polyfill => {
-      polyfill.isSupported()
-    })
-  )
+  return baseSupport && Object.values(polyfills).every(polyfill => polyfill.isSupported())
 }
 
 export function isPolyfilled() {
-  return Object.values(polyfills).every(polyfill => {
-    polyfill.isPolyfilled()
-  })
+  return Object.values(polyfills).every(polyfill => polyfill.isPolyfilled())
 }
 
 export function apply() {

src/form-requestsubmit.ts

@@ -0,0 +1,73 @@
+import {requestSubmit, apply, isPolyfilled, isSupported} from '../lib/form-requestsubmit.js'
+
+describe('requestSubmit', () => {
+  let form
+  beforeEach(() => {
+    form = document.createElement('form')
+    document.body.append(form)
+  })
+  afterEach(() => {
+    form.remove()
+  })
+
+  it('has standard isSupported, isPolyfilled, apply API', () => {
+    expect(isSupported).to.be.a('function')
+    expect(isPolyfilled).to.be.a('function')
+    expect(apply).to.be.a('function')
+    expect(isSupported()).to.be.a('boolean')
+    expect(isPolyfilled()).to.equal(false)
+  })
+
+  it('does not dispatch or submit for invalid forms', () => {
+    const input = document.createElement('input')
+    input.required = true
+    form.append(input)
+    let called = false
+    form.addEventListener('submit', () => {
+      called = true
+    })
+    requestSubmit.call(form)
+    expect(called).to.equal(false)
+  })
+
+  it('dispatches submit event', () => {
+    const input = document.createElement('input')
+    form.append(input)
+    let called = false
+    form.addEventListener('submit', event => {
+      called = true
+      event.stopPropagation()
+    })
+    requestSubmit.call(form)
+    expect(called).to.equal(true)
+  })
+
+  it('passes submitter in event', () => {
+    const input = document.createElement('input')
+    input.type = 'button'
+    form.append(input)
+    let submitter = null
+    form.addEventListener('submit', event => {
+      submitter = event.submitter
+      event.stopPropagation()
+    })
+    requestSubmit.call(form, input)
+    expect(submitter).to.equal(input)
+  })
+
+  it('includes the input value in FormData', () => {
+    const input = document.createElement('input')
+    input.type = 'button'
+    input.name = 'foo'
+    input.value = '1'
+    form.append(input)
+    let formdata = null
+    form.addEventListener('submit', event => {
+      formdata = new FormData(form)
+      event.stopPropagation()
+    })
+    requestSubmit.call(form, input)
+    expect(formdata.get('foo')).to.equal('1')
+    expect(Array.from(form.querySelectorAll('input')).length).to.equal(1)
+  })
+})