Add failing test for with props misuse

[jstarry]

When rendering components with the html! macro, with props can be used to simplify passing props to a component. This approach can not be used with the other approach of passing props one by one. We should have a test that fails when two approaches are combined to make sure the compile error message is nice!

with props approach

html! {
  <MyComponent with props />
}

list props approach

html! {
  <MyComponent value=1 name="hello" />
}

not allowed

html! {
  <MyComponent with props value=1 />
}

Note that there is an exception. Since ref is a special tag, it is still allowed in conjunction with with props. It must come after with props though.

html! {
  <MyComponent with props ref=..  />
}

[captain-yossarian]

@jstarry Is this good place to add tests ?

[jstarry]

@captain-yossarian not quite. The goal of this issue is to make sure that compiler error messages are helpful and we put those types of tests here. So a good place would be here: https://github.com/yewstack/yew/blob/master/tests/macro/html-component-fail.rs#L60

[jstarry]

@captain-yossarian I just updated the issue description. It was a bit outdated and didn't call out ref as a special case. We specifically need tests that warn against these cases:

html! {
  <MyComponent with props value=1 />
}

html! {
  <MyComponent value=1 with props />
}

And it would be great if the error message explained that the value=1 syntax and with props syntax are not allowed together

[captain-yossarian]

I have a problem with tests :(

[joaquindk]

@jstarry @captain-yossarian Is this still an issue after #960 being merged?

[jstarry]

Nope it's fixed. thanks