Skip to content

Commit 820db70

Browse files
davesnxdavesnx
authored
Preparation to fix the issue with multiple-selectors (#554)
* Fix text-decoration printing * Format native/CSS * Fix e2e melange demo * Format murmur * Add test case for multiple selectors * Format Resolve * Enable universal in e2e melange * Remove open Resolve in Render * Enable render tests in test_parser * Fix dune stuff for demo melange * Move e2e into demo * Install latest dune * Forgot changes from e2e->demo * Annotate unit, remove annotations on ruleToDict * Fix Kloth interface copy and fix start_with * Format tne entire codebase * Fix Kloth interface * Fix tests and ci command * Make sure to install ocamlformat and others * Update lock in demo/melange
1 parent ab88bbb commit 820db70

File tree

113 files changed

+2796
-2505
lines changed

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

113 files changed

+2796
-2505
lines changed

‎.github/workflows/ci.yml

Lines changed: 5 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -95,6 +95,9 @@ jobs:
9595
- name: Test
9696
run: make test
9797

98+
- name: Format
99+
run: make format-check
100+
98101
- name: Release static
99102
run: make release-static
100103

@@ -129,8 +132,8 @@ jobs:
129132
path: node_modules
130133
key: npm-${{ matrix.os }}-${{ hashFiles('package.json') }}
131134

132-
- name: Run E2E tests
133-
run: make test-e2e
135+
- name: Run demo tests
136+
run: make test-demo
134137

135138
publish:
136139
name: Publish

‎CONTRIBUTING.md

Lines changed: 4 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -51,19 +51,19 @@ In any other case, follow the generic installation steps from [Reason documentat
5151

5252
Aside from all test suites, check the [Makefile](./Makefile) for all the available commands.
5353

54-
There are some end-to-end tests to ensure all the ppx generation is working as expected, under the `e2e/` folder. Which contains
54+
There are some end-to-end tests to ensure all the ppx generation is working as expected, under the `demo/` folder. Which contains
5555

5656
```bash
57-
$ tree -L 1 e2e
58-
e2e
57+
$ tree -L 1 demo
58+
demo
5959
├── melange
6060
├── rescript-v10-JSX4
6161
└── rescript-v9-JSX3
6262
```
6363

6464
```bash
6565
make build
66-
make test_e2e_rescript_v10
66+
make test_demo_rescript_v10
6767
```
6868

6969
## Release process

‎Makefile

Lines changed: 35 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -46,7 +46,7 @@ create-switch: ## Create opam switch
4646

4747
.PHONY: install
4848
install: ## Install project dependencies
49-
opam install . --deps-only --with-test --working-dir . -y
49+
opam install . --deps-only --with-test --with-dev-setup --working-dir . -y
5050
npm install
5151

5252
.PHONY: init
@@ -91,33 +91,33 @@ $(foreach target,$(TEST_TARGETS), $(eval $(call create-test,$(target))))
9191
$(foreach target,$(TEST_TARGETS), $(eval $(call create-test-watch,$(target))))
9292
$(foreach target,$(TEST_TARGETS), $(eval $(call create-test-promote,$(target))))
9393

94-
.PHONY: test-e2e-rescript-v9
95-
test-e2e-rescript-v9: ## Run End-to-end tests for JSX3
96-
npm --prefix 'e2e/rescript-v9-JSX3' install
97-
npm --prefix 'e2e/rescript-v9-JSX3' run build
98-
npm --prefix 'e2e/rescript-v9-JSX3' run test
94+
.PHONY: test-demo-rescript-v9
95+
test-demo-rescript-v9: ## Run End-to-end tests for JSX3
96+
npm --prefix 'demo/rescript-v9-JSX3' install
97+
npm --prefix 'demo/rescript-v9-JSX3' run build
98+
npm --prefix 'demo/rescript-v9-JSX3' run test
9999

100-
.PHONY: test-e2e-rescript-v9-watch
101-
test-e2e-rescript-v9-watch: ## Run End-to-end tests for JSX3
102-
npm --prefix 'e2e/rescript-v9-JSX3' run test-watch
100+
.PHONY: test-demo-rescript-v9-watch
101+
test-demo-rescript-v9-watch: ## Run End-to-end tests for JSX3
102+
npm --prefix 'demo/rescript-v9-JSX3' run test-watch
103103

104-
.PHONY: test-e2e-rescript-v9-promote
105-
test-e2e-rescript-v9-promote: ## Run End-to-end tests for JSX3
106-
npm --prefix 'e2e/rescript-v9-JSX3' run test-promote
104+
.PHONY: test-demo-rescript-v9-promote
105+
test-demo-rescript-v9-promote: ## Run End-to-end tests for JSX3
106+
npm --prefix 'demo/rescript-v9-JSX3' run test-promote
107107

108-
.PHONY: test-e2e-rescript-v10
109-
test-e2e-rescript-v10: ## Run End-to-end tests for JSX4
110-
npm --prefix 'e2e/rescript-v10-JSX4' install
111-
npm --prefix 'e2e/rescript-v10-JSX4' run build
112-
npm --prefix 'e2e/rescript-v10-JSX4' run test
108+
.PHONY: test-demo-rescript-v10
109+
test-demo-rescript-v10: ## Run End-to-end tests for JSX4
110+
npm --prefix 'demo/rescript-v10-JSX4' install
111+
npm --prefix 'demo/rescript-v10-JSX4' run build
112+
npm --prefix 'demo/rescript-v10-JSX4' run test
113113

114-
.PHONY: test-e2e-rescript-v10-watch
115-
test-e2e-rescript-v10-watch: ## Run End-to-end tests for JSX4
116-
npm --prefix 'e2e/rescript-v10-JSX4' run test-watch
114+
.PHONY: test-demo-rescript-v10-watch
115+
test-demo-rescript-v10-watch: ## Run End-to-end tests for JSX4
116+
npm --prefix 'demo/rescript-v10-JSX4' run test-watch
117117

118-
.PHONY: test-e2e-rescript-v10-promote
119-
test-e2e-rescript-v10-promote: ## Run End-to-end tests for JSX4
120-
npm --prefix 'e2e/rescript-v10-JSX4' run test-promote
118+
.PHONY: test-demo-rescript-v10-promote
119+
test-demo-rescript-v10-promote: ## Run End-to-end tests for JSX4
120+
npm --prefix 'demo/rescript-v10-JSX4' run test-promote
121121

122122
.PHONY: test
123123
test: build
@@ -129,23 +129,23 @@ test: build
129129
fi \
130130
done
131131

132-
.PHONY: test-e2e
133-
test-e2e: build test-e2e-rescript-v9 test-e2e-rescript-v10 ## Run E2E tests
132+
.PHONY: test-demo
133+
test-demo: build test-demo-rescript-v9 test-demo-rescript-v10 ## Run demo tests
134134

135135
# Demo
136136

137-
.PHONY: demo-e2e-rescript-v10
138-
demo-e2e-rescript-v10: build ## Run the ReScript v10 demo with JSX4
139-
npm --prefix 'e2e/rescript-v10-JSX4' install
140-
npm --prefix 'e2e/rescript-v10-JSX4' run start
137+
.PHONY: demo-demo-rescript-v10
138+
demo-demo-rescript-v10: build ## Run the ReScript v10 demo with JSX4
139+
npm --prefix 'demo/rescript-v10-JSX4' install
140+
npm --prefix 'demo/rescript-v10-JSX4' run start
141141

142-
.PHONY: demo-e2e-melange-debug
143-
demo-e2e-melange-debug: ## Run the melange server demo
144-
$(DUNE) exec e2e-melange-debug
142+
.PHONY: demo-demo-melange-server
143+
demo-demo-melange-server: ## Run the melange server demo
144+
$(DUNE) exec demo-melange-server
145145

146-
.PHONY: demo-e2e-melange-debug-watch
147-
demo-e2e-melange-debug-watch: ## Run (and watch) the melange server demo
148-
$(DUNE) exec e2e-melange-debug --watch
146+
.PHONY: demo-demo-melange-server-watch
147+
demo-demo-melange-server-watch: ## Run (and watch) the melange server demo
148+
$(DUNE) exec demo-melange-server --watch
149149

150150
# Debug commands
151151

‎e2e/melange/index.re renamed to ‎demo/melange/client.re

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@ let element = ReactDOM.querySelector("#root");
22
switch (element) {
33
| Some(root) =>
44
let root = ReactDOM.Client.createRoot(root);
5-
ReactDOM.Client.render(root, <Ui.App />);
5+
ReactDOM.Client.render(root, <App />);
66
| None =>
77
Js.Console.error("Failed to start React: couldn't find the #root element")
88
};

‎e2e/melange/dune renamed to ‎demo/melange/dune

Lines changed: 9 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,23 +1,23 @@
11
(melange.emit
2-
(alias e2e-melange)
3-
(target e2e-melange)
4-
(modules :standard \ debug)
5-
(libraries ui styled-ppx.melange reason-react)
2+
(alias demo-melange)
3+
(target demo-melange)
4+
(modules :standard \ server)
5+
(libraries lib_js styled-ppx.melange reason-react)
66
(preprocess
77
(pps melange.ppx styled-ppx reason-react-ppx))
88
(module_systems
99
(commonjs bs.js)))
1010

1111
(executable
12-
(name debug)
13-
(public_name e2e-melange-debug)
14-
(modules :standard \ index)
12+
(name server)
13+
(public_name demo-melange-server)
14+
(modules :standard \ client)
1515
(libraries
16-
ui_native
16+
lib_native
1717
server-reason-react.js
1818
server-reason-react.belt
1919
server-reason-react.react
2020
server-reason-react.reactDom
2121
styled-ppx.native)
2222
(preprocess
23-
(pps styled-ppx)))
23+
(pps styled-ppx server-reason-react.ppx)))

‎demo/melange/lib/js/app.re

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
[@react.component]
2+
let make = () => <div className=Universal.classname />;

‎e2e/melange/src/ui/dune renamed to ‎demo/melange/lib/js/dune

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,11 @@
11
(library
2-
(name ui)
2+
(name lib_js)
33
(wrapped false)
44
(modes melange)
55
(libraries melange.belt styled-ppx.melange reason-react)
66
(preprocess
77
(pps melange.ppx styled-ppx reason-react-ppx)))
8+
9+
(copy_files
10+
(only_sources)
11+
(files "../native/shared/*.{re,ml}"))

‎demo/melange/lib/native/app.re

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,2 @@
1+
[@react.component]
2+
let make = () => <Main />;

‎e2e/melange/src/native/dune renamed to ‎demo/melange/lib/native/dune

Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,6 @@
11
(library
2-
(name ui_native)
2+
(name lib_native)
3+
(wrapped false)
34
(libraries
45
styled-ppx.native
56
server-reason-react.react
@@ -8,3 +9,7 @@
89
server-reason-react.reactDom)
910
(preprocess
1011
(pps styled-ppx --native server-reason-react.ppx)))
12+
13+
(copy_files
14+
(only_sources)
15+
(files "./shared/*.{re,ml}"))

‎e2e/melange/src/native/ui.re renamed to ‎demo/melange/lib/native/shared/Main.re

Lines changed: 19 additions & 22 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@
1414

1515
let stack = [%cx "display: flex; flex-direction: column"];
1616
let stackGap = gap => [%cx "gap: $(gap)"];
17+
1718
module Cositas = [%styled.div
1819
(~lola=CSS.px(0)) => {|
1920
display: flex;
@@ -46,7 +47,7 @@ let bounce = [%keyframe
4647
|}
4748
];
4849

49-
let code = [| `quoted("Menlo"), `quoted("monospace") |];
50+
let code = [|`quoted("Menlo"), `quoted("monospace")|];
5051
let lola = `auto;
5152

5253
let clx = [%cx
@@ -85,26 +86,9 @@ let container = [%cx
8586
|}
8687
];
8788

88-
module App = {
89-
[@react.component]
90-
let make = () =>
91-
<>
92-
<div className=post>
93-
<div className={card ++ " " ++ container}>
94-
<h2> {React.string("Card title")} </h2>
95-
<p> {React.string("Card content")} </p>
96-
</div>
97-
</div>
98-
<Cositas as_="section" lola={CSS.px(10)}>
99-
<div className=clx> {React.string("code everywhere!")} </div>
100-
<div className=selectors> {React.string("Red text")} </div>
101-
</Cositas>
102-
</>;
103-
};
104-
10589
let color = `hex("333");
10690

107-
let _ = [%css
91+
let gradiend = [%cx
10892
{|
10993
background-image:
11094
repeating-linear-gradient(
@@ -117,6 +101,19 @@ let _ = [%css
117101
|}
118102
];
119103

120-
let getStaticMarkup = () => {
121-
ReactDOM.renderToStaticMarkup(<App />);
122-
};
104+
[@react.component]
105+
let make = () =>
106+
<main className=gradiend>
107+
<div className=Universal.classname>
108+
<div className=post>
109+
<div className={card ++ " " ++ container}>
110+
<h2> {React.string("Card title")} </h2>
111+
<p> {React.string("Card content")} </p>
112+
</div>
113+
</div>
114+
<Cositas as_="section" lola={CSS.px(10)}>
115+
<div className=clx> {React.string("code everywhere!")} </div>
116+
<div className=selectors> {React.string("Red text")} </div>
117+
</Cositas>
118+
</div>
119+
</main>;

‎demo/melange/lib/native/shared/universal.ml

Lines changed: 37 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,37 @@
1+
module Media = struct
2+
let mobile = "(min-width: 768px)"
3+
end
4+
5+
let languageIcon = "languageIcon"
6+
let headerMenuOpened = [%cx {||}]
7+
8+
let icon = [%cx {|
9+
position: relative;
10+
top: 3px;
11+
padding-left: 4px;
12+
|}]
13+
14+
let classname =
15+
[%cx
16+
{|
17+
cursor: pointer;
18+
19+
@media $(Media.mobile) {
20+
position: relative;
21+
22+
.$(icon) {
23+
position: absolute;
24+
right: 0;
25+
top: 20px;
26+
}
27+
}
28+
29+
:hover, &.$(headerMenuOpened) {
30+
opacity: 1;
31+
color: #ace;
32+
33+
@media $(Media.mobile) {
34+
color: #eca;
35+
}
36+
}
37+
|}]

0 commit comments

Comments
 (0)