vuego/eval_slot_test.go at main · titpetric/vuego · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
package vuego_test

import (
	"bytes"
	"os"
	"testing"
	"testing/fstest"

	"github.com/stretchr/testify/require"

	"github.com/titpetric/vuego"
)

func TestSlot_Default(t *testing.T) {
	root := os.DirFS("testdata/fixtures")
	vue := vuego.NewVue(root)
	vue.RegisterComponent("slot-button", "components/SlotButton.vuego")

	var buf bytes.Buffer
	err := vue.RenderFragment(t.Context(), &buf, "slot-default.vuego", nil)
	require.NoError(t, err)

	result := buf.String()
	require.Contains(t, result, "btn")
	require.Contains(t, result, "Click me")
	require.NotContains(t, result, "Submit") // Should not use fallback
}

func TestSlot_Fallback(t *testing.T) {
	root := os.DirFS("testdata/fixtures")
	vue := vuego.NewVue(root)
	vue.RegisterComponent("slot-button", "components/SlotButton.vuego")

	var buf bytes.Buffer
	err := vue.RenderFragment(t.Context(), &buf, "slot-fallback.vuego", nil)
	require.NoError(t, err)

	result := buf.String()
	require.Contains(t, result, "btn")
	require.Contains(t, result, "Submit") // Should use fallback
}

func TestSlot_Named(t *testing.T) {
	root := os.DirFS("testdata/fixtures")
	vue := vuego.NewVue(root)
	vue.RegisterComponent("modal", "components/Modal.vuego")

	var buf bytes.Buffer
	err := vue.RenderFragment(t.Context(), &buf, "slot-named.vuego", nil)
	require.NoError(t, err)

	result := buf.String()
	require.Contains(t, result, "modal-header")
	require.Contains(t, result, "Header Content")
	require.Contains(t, result, "modal-body")
	require.Contains(t, result, "Body Content")
	require.Contains(t, result, "modal-footer")
	require.Contains(t, result, "Footer Content")
}

func TestSlot_Scoped(t *testing.T) {
	root := os.DirFS("testdata/fixtures")
	vue := vuego.NewVue(root)
	vue.RegisterComponent("list", "components/List.vuego")

	var buf bytes.Buffer
	err := vue.RenderFragment(t.Context(), &buf, "slot-scoped.vuego", map[string]any{
		"products": []string{"Apple", "Banana", "Cherry"},
	})
	require.NoError(t, err)

	result := buf.String()
	require.Contains(t, result, "Apple (#0)")
	require.Contains(t, result, "Banana (#1)")
	require.Contains(t, result, "Cherry (#2)")
}

func TestSlot_NamedScoped(t *testing.T) {
	root := os.DirFS("testdata/fixtures")
	vue := vuego.NewVue(root)
	vue.RegisterComponent("tabs", "components/Tabs.vuego")

	var buf bytes.Buffer
	err := vue.RenderFragment(t.Context(), &buf, "slot-named-scoped.vuego", nil)
	require.NoError(t, err)

	result := buf.String()
	require.Contains(t, result, "tabs-header")
	require.Contains(t, result, "Header: Welcome")
	require.Contains(t, result, "tabs-content")
	require.Contains(t, result, "Items: 3")
}

func TestSlot_SimpleScoped(t *testing.T) {
	root := os.DirFS("testdata/fixtures")
	vue := vuego.NewVue(root)
	vue.RegisterComponent("simple-slot", "components/SimpleSlot.vuego")

	var buf bytes.Buffer
	err := vue.RenderFragment(t.Context(), &buf, "simple-scoped.vuego", map[string]any{
		"message": "Hello",
	})
	require.NoError(t, err)

	result := buf.String()
	require.Contains(t, result, "Message: Hello")
}

func TestSlot_InheritedFromLayout(t *testing.T) {
	inlineFS := &fstest.MapFS{
		"page.vuego": &fstest.MapFile{Data: []byte(`---
layout: slotted
---
<template #sidebar><nav>Side Nav</nav></template>`)},
		"layouts/slotted.vuego": &fstest.MapFile{Data: []byte(`<div class="sidebar"><slot name="sidebar"><p>Default sidebar</p></slot></div>
<div class="main" v-html="content"></div>`)},
	}

	renderer := vuego.NewFS(inlineFS)

	var buf bytes.Buffer
	err := renderer.Load("page.vuego").Fill(nil).Render(t.Context(), &buf)
	require.NoError(t, err)

	result := buf.String()
	require.Contains(t, result, "Side Nav", "inherited slot content should be rendered")
	require.NotContains(t, result, "Default sidebar", "fallback slot content should not be used")
	require.Contains(t, result, "sidebar", "layout structure with sidebar class should be present")
}