Comments (5)
Hey @cblavier, thank you! I have started prototyping it already. Will share you the flow of message from preview to telemetry to LV that I have come up with later on and see if you agree with it.
from phoenix_storybook.
@cblavier are you working on this already? I wanted to give this one a try
I am thinking if we can use telemetry here to catch events
@lv_events [
[:phoenix, :live_view, :handle_event, :stop],
[:phoenix, :live_component, :handle_event, :stop]
]
def start(_, _) do
...
:telemetry.attach_many(
"phx-lv",
@lv_events,
&handle_event/4,
nil
)
...
end
def handle_event(span, event, metadata, nil) when span in @lv_events do
IO.inspect(event, label: "EVENT")
IO.inspect(metadata, label: "META")
:ok
end
With this, we can get something like this:
EVENT: %{duration: 11222, monotonic_time: -576460634209427886}
META: %{
component: MyComponents.Compo,
event: "toggle",
params: %{"value" => ""},
socket: #Phoenix.LiveView.Socket<
assigns: %{
__changed__: %{show: true},
flash: %{},
id: "compo-default-component",
inner_block: [
%{
__slot__: :inner_block,
inner_block: #Function<41.3316493/2 in :erl_eval.expr/6>
}
],
myself: %Phoenix.LiveComponent.CID{cid: 2},
show: true
},
endpoint: MyWeb.Endpoint,
id: "phx-Fw_P0A_tAWChAQaC",
parent_pid: nil,
root_pid: #PID<0.5624.0>,
router: MyWeb.Router,
transport_pid: #PID<0.5620.0>,
view: PhxLiveStorybook.EntryLive,
...
>,
telemetry_span_context: #Reference<0.186454552.4109369348.61147>
}
from phoenix_storybook.
No, I have not started working on it.
I would be happy to receive external contributions. I just didn't take time yet to write a contributing.md
guide.
Regarding your question, I didn't think of using telemetry for this (yet I wrote the AppSignal adapter for LiveView with telemetry events 🤦) but it looks like an excellent idea!
As it looks very verbose, I think the event log should be a list of collapsible items.
from phoenix_storybook.
Feel free to ask for help if you want to understand how this is working under the hood, or if you don't know where you should put your code
from phoenix_storybook.
Contributing guide is online
from phoenix_storybook.
Related Issues (20)
- Fails to run `mix phx.gen.storybook` on phoenix `1.7.3` HOT 4
- Dialyzer is no longer working HOT 1
- Internal assets aren't being found even that they exist HOT 5
- Export formatter rules for `live_storybook/2` HOT 7
- Stories with large attributes fail to load HOT 3
- Hex release not independently compilable HOT 2
- Make CSRF token optional
- Generated stories have `Elixir.` prefix in aliases and for function components
- Compile failure with earmark 1.4.41 HOT 3
- `theme` Attribute does not render in the example code HOT 4
- Cannot get any of my own components to display properly in the stories view HOT 11
- Strange whitebar on chrome/safari since MacOS Sonoma update
- Inter font makes request to external source
- Add `defer` attribute to `<script>` tag HOT 1
- Global Color Change HOT 1
- Prefix event names in StoryLive
- Elixir warning for slice with negative steps
- allow passing additional options to story HOT 1
- Compatibility with Phoenix HTML 4.0.0
- error: undefined function (there is no such import) nofile:1 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 phoenix_storybook.