Skip to content

Commit

Permalink
fix(omi): missing form element value
Browse files Browse the repository at this point in the history
  • Loading branch information
dntzhang committed Dec 20, 2023
1 parent af09bd6 commit 5424ef7
Show file tree
Hide file tree
Showing 5 changed files with 86 additions and 4 deletions.
42 changes: 42 additions & 0 deletions packages/omi/examples/form.tsx
@@ -0,0 +1,42 @@
import { render, tag, Component, h } from '@/index'

@tag('form-demo')
class FormDemo extends Component {
state = {
show: true,
value1: 'volvo',
value2: '',
}

onChange = (evt) => {
this.state.value1 = evt.target.value
this.update()
}

render() {
return (
<div>
{this.state.show && <select id="cars" value={this.state.value1} onChange={this.onChange} name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>}

<select id="cars2" value={this.state.value2} name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>

<button onClick={(evt) => {
this.state.show = !this.state.show
this.update()
}}>验证this.update后表单状态</button>
</div>
)
}
}

render(<form-demo />, document.body)
2 changes: 1 addition & 1 deletion packages/omi/package.json
@@ -1,6 +1,6 @@
{
"name": "omi",
"version": "7.3.9",
"version": "7.3.10",
"scripts": {
"start": "vite",
"dev-vite": "vite",
Expand Down
3 changes: 1 addition & 2 deletions packages/omi/src/dom.ts
Expand Up @@ -109,8 +109,7 @@ export function setAccessor(
name !== 'type' &&
name !== 'css' &&
!isSvg &&
name in node &&
value !== ''
name in node
) {
//value !== '' fix for selected, disabled, checked with pure element
// Attempt to set a DOM property to the given value.
Expand Down
2 changes: 1 addition & 1 deletion packages/omi/src/index.ts
Expand Up @@ -18,4 +18,4 @@ export { Signal } from './signal'
export { css } from './css-tag'
export { mixin } from './options'
export { registerDirective } from './directive'
export const version = '7.3.9'
export const version = '7.3.10'
41 changes: 41 additions & 0 deletions packages/omi/test/dom.test.jsx
Expand Up @@ -72,6 +72,47 @@ describe('dom', () => {
expect(parentElement.firstChild.shadowRoot.innerHTML).toBe('<div><span>abc</span></div>')
})

it('form', () => {
class Ele extends Component {

state = {
show: true,
value1: 'volvo',
value2: '',
}

installed() {
this.state.show = false
this.update()
}

render(props) {
return <div>
{this.state.show && <select id="cars" value={this.state.value1} onChange={this.onChange} name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>}

<select id="cars2" value={this.state.value2} name="cars">
<option value="volvo">Volvo</option>
<option value="saab">Saab</option>
<option value="mercedes">Mercedes</option>
<option value="audi">Audi</option>
</select>

</div>
}
}

const node = genNode()
define(node.name, Ele)
render(<node.name />, parentElement)

expect(parentElement.firstChild.shadowRoot.querySelector('select').value).toBe('')
})

it('string style', () => {
class Ele extends Component {

Expand Down

0 comments on commit 5424ef7

Please sign in to comment.