Bug: Unable to set `value` of ButtonHTMLAttributes to object type

This issue has been created since 2022-09-22.

React version: Type definitions for React 18.0

Steps To Reproduce

  1. Attempt to set the value to button as anything that is not (string | ReadOnlyArray | number | undefined)

Link to code example:

Link to example in code sandbox

The current behavior

Error Message from TS

Type '{ name: string; sortOrder: number; }' is not assignable to type 'string | number | string[]'.
  Object literal may only specify known properties, and 'name' does not exist in type 'string[]'.ts(2322)
index.d.ts(1788, 9): The expected type comes from property 'value' which is declared here on type 'DetailedHTMLProps<ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>'

The expected behavior

Don't give me an error for this, there are no type constraints on the value for a button.

This is causing an issue with library Material-ui (Mui.com) which uses the interface ButtonHTMLAttributes<T> extends HTMLAttributes<T> which says the value can only be of type string | ReadonlyArray<string> | number | undefined. They use it on their MenuItem component which is used within the Select component which disallows the use of assigning an object to the MenuItem. I can @ts-ignore this or set the object to as any and bypass the TS issue and the HTML works.

To me if you can use @ts-ignore or as any to get around a TS error there is an issue with the types applied to the attributes for the HMLT element.

Please let me know if this is correct to post here or should Mui.com be responsible to not type the MenuItem as an extension of this interface which ultimately is preventing me from assigning the object to the value.

eps1lon wrote this answer on 2022-09-22

The value is passed to the native <button /> HTML element and does not allow an object. It would end up as '[object Object]' in the rendered output and event handlers using event.currentTarget.value.

marcusjwhelan wrote this answer on 2022-09-22

I see then it is an issue with mui.com types trying to use buttons types because thiers works and using a straight button doesn't allow an object.

More Details About Repo
Owner Name facebook
Repo Name react
Full Name facebook/react
Language JavaScript
Created Date 2013-05-24
Updated Date 2022-09-27
Star Count 195296
Watcher Count 6655
Fork Count 40431
Issue Count 1113

YOU MAY BE INTERESTED

Issue Title Created Date Comment Count Updated Date
[feature] shift click on taskbar opens new document 0 2022-03-30 2022-08-19
Update Nuget package 3 2022-03-29 2022-08-23
Play can't catch the song 4 2021-11-07 2022-05-11
SettingsInProgress Error 5 2020-03-07 2022-09-24
unrejecting a CVE Record always fails because dateRejected stays 0 2022-06-12 2022-08-08
uniqueEnglishDescription is only used for rejected, not published, records 0 2022-06-13 2022-08-01
rejectExistingCve must be changed to set dateRejected 0 2022-06-12 2022-07-21
UI for team management 0 2019-06-26 2022-06-16
🧩 FEATURE REQUEST: Add a link to the source when an article is not directly linked 1 2022-07-21 2022-09-02
Bismark mapper subdividing results in empty file 12 2022-01-05 2022-08-26
Getting Cpp17MoveInsertable error on OpenBSD 2 2021-07-31 2022-09-17
Project Activation [cmake] 0 2021-01-20 2022-09-24
remove support for deprecated SVG format 1 table and embedded colorPalettes? 3 2021-10-12 2022-06-29
`flow_view_deps()` should use `find()` 1 2022-03-07 2022-09-16
Cesium Ion Tiled not showing high res layers 9 2021-02-14 2022-08-04
BUGFIX v0.5.0 - Handling of missing values in repeated measurements 3 2021-10-23 2022-07-15
Issue CcminerXaya Hashrate 4 2021-10-26 2022-09-16
seleniumwire.undetected_chromedriver.v2 CloudFlare problem (works without seleniumwire) 2 2021-08-04 2022-09-16
iproute2: ADD_ADDR: ports support 2 2021-02-18 2022-06-08
Maybe update the default locust version? 3 2021-08-11 2022-08-10
Created wrongly 0 2021-07-27 2022-01-21
[dhctl] Give an opportunity for using ssh-hosts from command-line arguments for converge 0 2022-03-29 2022-07-22
Viewing Nested Json Logs 2 2021-04-15 2022-08-21
CircleCI: build on caches, not exponential built workspaces 2 2021-05-06 2022-09-10
Push `tree-sitter` version 0.20.4 to npm 1 2022-01-30 2022-09-09
🆕 The 2021 LRR User Survey is live! 🆕 5 2021-04-07 2022-09-23
open configuration file does not load mappings, save works 2 2021-02-24 2022-09-06
Docker container with platform linux/arm64 was build with GOARCH=amd64 0 2022-07-22 2022-08-11
Spawn new fake player makes lag 2 2022-08-08 2022-09-19
`ReadableStreamDefaultReader.read()` return values 6 2021-03-24 2022-09-21
chapter3-3配置druid监控的问题 0 2022-02-07 2022-09-09
[BUG]: HW Regression - KOF 2003 - Visual glitches on character sprites 2 2022-04-30 2022-09-05
Medically controlled hypertension 3 2022-03-31 2022-09-16
Attempting to understand the `Transferable` interface 1 2022-09-10 2022-09-19
Overextrusion with Creality CR 10S Pro 3 2021-12-11 2022-09-17
[BUG] <forge makes minecraft not want to start (all versions)> 1 2022-07-13 2022-09-16
[BUG] <Short description> 1 2022-07-13 2022-09-16
[F-Req] <Short description> 2 2022-07-13 2022-09-18
Regex Queries are slow 0 2022-03-16 2022-09-25
Different pills are at different %zuse versions. 1 2022-07-04 2022-08-23
Entering a value into Height Range Modifier changed the viewpoint instead 1 2021-09-30 2022-09-10
Replace failing disk in Kessie (reprise) 1 2021-12-15 2022-08-24
[BUG] how to get the Baileys module to be installed 1 2022-09-10 2022-09-26
An editable Paragraph component is not available 2 2022-03-19 2022-08-04
cross2eth ebrelayer datarace 1 2022-01-25 2022-09-12
Queue a pipeline with parameters 12 2020-05-06 2022-09-16
Target is invalid after modification 1 2022-05-10 2022-08-30
by_vals() is unsound in 1.0.0-rc1 1 2021-12-03 2022-09-22
软键盘弹起播放视频会出错 0 2021-12-16 2022-01-16
Create a reusable alias for each forwardRef'd component 9 2021-04-22 2022-09-25