Comments (3)
nathanhack
commented on May 21, 2024
2
@chullino I'm not an authority on Vecty nor a web guru but given your question I think of two things you could test.
- in a test, setup your component and compare the render output to what you expect.
- in a test, setup your server and request the page then compare to something expected.
The first one is a unit test and the second one is more of a integration test.
There is talk of adding server side rendering #23 to Vecty. I think once that was completed then doing what your asking for will be easy.
from vecty.
slimsag
commented on May 21, 2024
I haven't seen any good info yet on how TodoMVC handles testing; and think we should probably opt for just proper testing of Vecty instead of todomvc-specific testing. Please create a new issue if you think otherwise. :)
from vecty.
chullino
commented on May 21, 2024
Bump! Is there any proper testing of Vecty based application?
Currently, I'm working on creating test code for Vecty-based web app.
I'm assured that I can create react-like code using Vecty, and I'm assured that I can test HTML GET API is working well, but I'm not sure if I can test rendered HTML to validate my vecty-generated HTML.
To speak with (bloated :<) example, I can create react-like code using Vecty like below. When this code is transpiled to JS and executed on the browser, it will create left-floated red box written "Hello Vecty!".
// Render &PageView{} into div element with id `vecty-content`
func main() {
vecty.SetTitle("Hello Vecty!")
err := vecty.RenderInto("#vecty-content", &PageView{})
if err!= nil{
panic(err)
}
}
// PageView is our main page component.
type PageView struct {
vecty.Core
}
// Render implements the vecty.Component interface.
func (p *PageView) Render() vecty.ComponentOrHTML {
return elem.Div(
vecty.Markup(
vecty.Style("float", "left"),
vecty.Style("background-color", "red"),
),
vecty.Text("Hello Vecty!"),
)
}
Also, I can test HTML GET API is working well using httptest. performRequest function is used for http test.
func Test_All_Routes_Status_200(t *testing.T) {
// Setup router
router := setUp()
// data for test
tests := []string {
"/vecty",
}
for _, test := range tests {
t.Run(test, func(t *testing.T) {
// Perform a GET request with that handler.
res := performRequest(router, "GET", test)
// Assert we encoded correctly, the request gives a 200
assert.Equal(t, http.StatusOK, res.Code)
})
}
}
func performRequest(r http.Handler, method, path string) *httptest.ResponseRecorder {
req, _ := http.NewRequest(method, path, nil)
res := httptest.NewRecorder()
r.ServeHTTP(res, req)
return res
}
But the problem is that I have no idea on how to test rendered HTML. For example, I have HTML like this.
{{define "vecty.html"}}
<html>
<body>
{{template "header.tmpl" .}}
{{template "navBar.tmpl"}}
{{template "contents.tmpl" .}}
<div id="vecty-content"></div>
<script src="/static/templates/vecty/scripts/scripts.js"></script>
</body>
</html>
{{end}}
The point that I'm stucked is that I don't know how to test script-rendered HTML.
This question is not about the TodoMVC test. It's a question about how to create test for script-tendered HTML. I opted for issues on vecty script testing and this issue was the most relevant one.
from vecty.
Related Issues (20)
- [Question]: How to contribute? HOT 11
- Add a basic example on usage HOT 5
- allow global panic handler HOT 2
- removeChild crashes if parent node is nil HOT 1
- [feature request] static HTML/CSS components HOT 6
- Examples go.mod file conflict HOT 1
- Add snake videogame example. HOT 4
- question: What is this prop vs. state idea HOT 3
- Instrumenting panic messages HOT 8
- question: initializing rendered HTML nodes via javascript HOT 4
- Porting gopherjs js calls to use with vecty HOT 2
- Document the availability of vecty project template generator HOT 1
- Return type of If function
- prop.Value("") does not produce the correct html on first render
- Vecty needs an official website HOT 10
- The slack invite link in readme is broken
- vecty docs HOT 1
- How to update a rendered element? HOT 10
- Failed Running The Example HOT 8
- Todo MVC example has misleading usage of p.Items HOT 2
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from vecty.