Storybook: Cerita tidak ditetapkan saat menjalankan server buku cerita

Sepertinya di v5 ini harus diperbaiki.

Kami telah merilis @storybook/react-native dengan banyak peningkatan inti. Ini tersedia di 5.1-alpha di next dan telah diverifikasi oleh beberapa pengguna RN di aplikasi mereka yang ada. Ini harus memperbaiki banyak masalah kompatibilitas, terutama jika Anda menggunakan fitur server web. Silakan mencobanya dan beri komentar di sini jika itu memperbaiki masalah Anda. Petunjuk migrasi tersedia di sini: https://github.com/storybooks/storybook/blob/next/MIGRATION.md#react -native-server

@Gongreg @rkhayat

Hai @shilman , @benoitdion Saya menggunakan versi 5.1.3 dari @storybook/react-native-server dan cerita pertama dimuat dengan baik, tetapi kemudian setelah memilih cerita yang berbeda, dikatakan Please open navigator and select a story to preview jika saya menyegarkan browser kemudian cerita yang saya pilih sebelumnya berfungsi dengan baik

Berikut ini seluruh kode yang bermasalah
https://github.com/alexakasanjeev/ecommerce-component-library/tree/bug/second-story-not-loading

Adakah pembaruan tentang kapan bug ini akan bekerja, atau apa yang menyebabkan bug ini?

Mengalami masalah ini juga.

Sepertinya beberapa masalah tambahan dibawa dengan buku cerita v5. Server React Native sekarang menggunakan solusi umum dengan kerangka kerja lain sehingga sedikit lebih sulit untuk memeriksanya.

Saya memiliki masalah yang sama, ada pembaruan tentang masalah ini?

Saya harus punya waktu besok untuk memeriksanya.

Saya juga mengalami ini, dengan senang hati membantu menguji versi pengembangan atau apa pun yang berguna.

Pada catatan umum: Saat menjalankan server web buku cerita, haruskah saya dapat memilih cerita dan berinteraksi dengannya (mis. Menyetel teks di UI menggunakan @storybook/addon-knobs ) _di browser web_? Saya memang melihat cerita saya di panel kiri halaman web, tetapi semua panel "utama" yang ditampilkan adalah halaman _Selamat datang di buku cerita_. Saya mendapat kesan bahwa saya harus melihat UI add-on.

Apakah saya salah paham bagaimana ini dimaksudkan untuk bekerja?

@ z00m1n , jika Anda menggunakan @ storybook / addon-knob, Anda akan melihat addons di browser web.

Halo.

Saya sudah mencoba bermain-main dengan hal-hal di sekitar. Saya berhasil membuat pemilihan cerita berfungsi. Namun yang menjadi jelas adalah kita harus mengupdate kode react-native untuk mendukung react-native-server dengan benar. Saya berharap bisa melakukannya minggu depan.

Masalah utamanya adalah ini:

1. Itu tidak terhubung ke react-native-server dengan benar.
2. Api toko cerita telah berubah dan kami menggunakan yang lama.

Apakah ini karena seseorang dari kode baru mulai menggunakan hook?

Cara acara dipancarkan telah berubah, kami memiliki beberapa peristiwa tidak berguna yang dipancarkan dari sisi asli react dan sekarang storyStore menggunakan storyId daripada jenis + cerita. Juga jika Anda entah bagaimana memanggil getStorybookUI beberapa kali koneksi ke server gagal.

Hei, saya telah membuat PR yang seharusnya menyelesaikan masalah. Karena kami tidak memiliki pengujian otomatis untuk RN, maka diperlukan beberapa pengujian manual

Terima kasih untuk itu @Gongreg! 👍
Saya benar-benar membutuhkan fitur ini sekarang untuk mengerjakan proyek saya saat ini - inning yang bagus untuk mencoba menyiapkan berbagai hal sehingga saya dapat menguji PR Anda dalam versi yang belum dirilis. Tidak tahu banyak tentang masalah secara umum, jadi tolong jangan berharap banyak 🥴
Jika Anda memiliki petunjuk yang menurut Anda mungkin berguna bagi saya untuk memulai, beri tahu saya.

Maaf, sepertinya saya tidak bisa menyiapkan berbagai hal untuk menguji PR. Saya terjebak di sini: https://github.com/storybookjs/storybook/blob/next/CONTRIBUTING.md#2 -link

1. Saya tidak tahu yang mana _storybook root directory_ itu
2. Saya tidak tahu yang mana _storybook-sandbox-app directory_ itu
3. yarn link @storybook/react atau yarn link @storybook/react-native gagal dengan
   error No registered package found called "@storybook/react". atau error No registered package found called "@storybook/react-native".

@ z00m1n , saya rasa cara terbaik bagi Anda untuk menguji sesuatu adalah dengan memasukkan kode baru ke dalam proyek node_modules Anda dan bermain dengannya. Saya tahu itu terdengar sangat konyol, tetapi sulit untuk menguji semuanya ketika buku cerita react-native ada di dalam monorepo.

Jika Anda ingin menjalankan proyek contoh di buku cerita monorepo, saya tidak dapat membantu saat ini karena saya tidak ingat bagaimana memulainya: /

Saya telah menguji perubahan sebanyak yang saya bisa. Baik dengan dan tanpa onDeviceUI dengan server terhubung dan tanpa. Bermain-main dengan kenop. Semua sepertinya berhasil. Jika Anda tidak bisa menjalankannya, jangan terlalu khawatir.

Di masa depan kami akan (saya harap dan saya akan mencoba menambahkannya) melakukan tes e2e yang akan membuat kami lebih percaya diri dengan perubahan.

masalah yang sama dengan @alexakasanjeev

storybook paket terkait versi 5.1.9

@sophister , sudah ada PR yang menyelesaikan masalah ini.

@ Gongreg yang pr memecahkan masalah ini?

Beberapa pesan di atas: https://github.com/storybookjs/storybook/pull/7187

Boo-yah !! Saya baru saja merilis https://github.com/storybookjs/storybook/releases/tag/v5.2.0-alpha.32 berisi PR # 7187 yang mereferensikan masalah ini. Tingkatkan versi hari ini untuk mencobanya!

Anda dapat menemukan prarilis ini di tag @next NPM.

Menutup masalah ini. Harap buka kembali jika menurut Anda masih banyak yang harus dilakukan.

@shilman Saya meningkatkan dari versi 5.1.9 ke versi 5.2.0-alpha.32. tetapi layar selalu mengatakan "Silakan buka navigator dan pilih cerita untuk melihat pratinjau." sedang menulis dengan cara tetap. Saya membersihkan cache dan mencoba banyak metode seperti ini.

@shilman Saya akan sekali lagi memeriksanya pada hari Senin. Saya memeriksanya tetapi karena semuanya ada di node_modules, ada kemungkinan ada sesuatu yang masih hilang :(

@erhanbicer , terima kasih sudah memeriksanya. @shilman , sepertinya story store api telah berubah dengan mode docs: o. Melakukan PR untuk memperbaikinya.

Dalam perbaikan saya menggunakan storyStore.setSelection(story) tetapi sebenarnya storyStore.setSelection({storyId});

@Gongreg Saya membuat perubahan secara manual. ini tidak berhasil untuk saya. Maaf!

@erhanbicer Anda menerapkan semua perubahan di PR baru # 7234 di 5.2.0-alpha.32? Saya telah mengujinya dengan / tanpa server dan mereka berhasil untuk saya.

@Gongreg ya, saya menerapkannya di 5.2.0-alpha.32.

"@storybook/react-native": "next",
"@storybook/react-native-server": "next",

Hanya untuk memastikan, dapatkah Anda menghapus penyimpanan asinkron Anda?

Hanya untuk memastikan, dapatkah Anda menghapus penyimpanan asinkron Anda?

@Tokopedia
Saya membersihkan semuanya. tapi tidak berhasil lagi

Apakah Anda melihat daftar cerita di dalam navigator (di aplikasi itu sendiri)? @erhan_cantik

@Gongreg Ya, daftar cerita muncul di aplikasi dan situs web.

Oke, satu pertanyaan lagi.

Jika Anda menonaktifkan server, apakah buku cerita berfungsi untuk Anda? Karena jika Anda menggunakan 5.2.0-alpha.32 tanpa buku cerita # 7234 seharusnya tidak bekerja untuk Anda.

Saya ingin memastikan bahwa kami mendapatkan hasil yang sama.

@Gongreg Ini juga tidak bekerja saat server dinonaktifkan.

Bagus. Kami memiliki kesamaan sekarang. Jadi, apakah Anda menerapkan perubahan di # 7234 ke direktori dist?

Aduh !! Saya baru saja merilis https://github.com/storybookjs/storybook/releases/tag/v5.2.0-alpha.33 berisi PR # 7234 yang mereferensikan masalah ini. Tingkatkan versi hari ini untuk mencobanya!

Anda dapat menemukan prarilis ini di tag @next NPM.

Menutup masalah ini. Harap buka kembali jika menurut Anda masih banyak yang harus dilakukan.

@erhanbicer , saya telah menguji 5.2.0-alpha.33, itu berhasil untuk saya.

@Gongreg Saya meningkatkan ke 5.2.0-alpha.33, dan menginstalnya kembali. hasil; Tidak berhasil.

https://i.imgur.com/1ynQK3I.png

versi rn: 0.59.9.0

@erhanbicer tidak ingin terdengar seperti rekaman rusak, tetapi hapus penyimpanan asinkron dan setel ulang cache.

@erhanbicer tidak ingin terdengar seperti rekaman rusak, tetapi hapus penyimpanan asinkron dan setel ulang cache.

@Tokopedia
Saya mencurigai proyek saya sendiri. Saya membuka proyek baru yang bersih dan melakukan penginstalan. Hasilnya sama saja. Anda dapat mencoba menariknya di sini jika Anda mau.

https://github.com/erhanbicer/alpha-storybook-test

Terima kasih. Saya akan memeriksanya besok. Saya minta maaf karena butuh waktu lama untuk memperbaikinya. Saya hanya tidak mendapatkan kesalahan apa pun secara lokal.

Semoga berhasil :)

Terima kasih atas usaha Anda @Gongreg ! Saya baru saja mendapat peringatan dalam pemasangan baru di sini ... Senang melihat bahwa hampir berakhir!

Hei, aku benar-benar tidak suka meninggalkan barang yang rusak, jadi aku lebih banyak menginvestasikannya.

Saya menemukan mengapa saya tidak mendapatkan masalah tersebut. Kami menggunakan github.com/wix/react-native-navigation di aplikasi kami dan ini menginisialisasi komponen lebih cepat daripada di aplikasi default. Membuat PR dengan perbaikan sekarang.

Membuat pr. Saya sangat berharap yang terakhir.

Maaf, tidak berfungsi. kesalahan yang sama tetap ada

@erhanbicer , menurut saya PR terakhir belum dirilis. Memeriksa

@erhanbicer , ETA 10 jam hingga rilis.

Menggigilkan saya kayu !! Saya baru saja merilis https://github.com/storybookjs/storybook/releases/tag/v5.2.0-alpha.35 berisi PR # 7243 yang mereferensikan masalah ini. Tingkatkan versi hari ini untuk mencobanya!

Anda dapat menemukan prarilis ini di tag @next NPM.

Menutup masalah ini. Harap buka kembali jika menurut Anda masih banyak yang harus dilakukan.

Tolong beri tahu saya bahwa itu berfungsi sekarang

@Gongreg Ya, berhasil. Terima kasih atas kerjamu. :)

Sepertinya tidak berfungsi di sini, masalah yang sama seperti sebelumnya. Mungkin saya melakukan sesuatu yang salah tentang penyiapan saya?

1. uninstall versi paket 5.1.9 npm

$ npm uninstall @storybook/react-native @storybook/react-native-server

1. instal @next versi

$ npm install @storybook/react-native<strong i="13">@next</strong> @storybook/react-native-server<strong i="14">@next</strong>

1. verifikasi versi paket yang diinstal

$ npm list --depth=0 2>&1 | grep <strong i="19">@storybook</strong>
├── @storybook/[email protected]
├── @storybook/[email protected]
├── @storybook/[email protected]
├── @storybook/[email protected]
├── @storybook/[email protected]
├── @storybook/[email protected]
├── @storybook/[email protected]

1. kode di .../storybook/index.js :

const StorybookUIRoot = getStorybookUI({ port: 6006, host: 'localhost' });

1. di jendela Terminal pertama, jalankan server buku cerita:

$ npm run storybook
  ...
> start-storybook -p 6006

? Port 6006 is not available. Would you like to run Storybook on port 6006 instead? Yes
info => Loading presets
info => Loading custom babel config as JS
╭──────────────────────────────────────────────────╮
│                                                  │
│   Storybook 5.2.0-alpha.36 started               │
│   3.19 s                                         │
│                                                  │
│   Local:            http://localhost:6006/       │
│   On your network:  http://10.188.111.6:6006/    │
│                                                  │
╰──────────────────────────────────────────────────╯

(pertanyaan penasaran BTW ;-))

1. di jendela Terminal kedua, jalankan aplikasi saya

$ expo start
  ...
Expo DevTools is running at http://localhost:19002
Starting Metro Bundler on port 19001.
Tunnel ready.
Your native app is running at exp1234567890abcdef://10.188.111.6:19000
Logs for your project will appear below. Press Ctrl+C to exit.
Finished building JavaScript bundle in 6631ms.
Running application on iPhone Xs.
  ...

1. mulai aplikasi di Xcode, jalankan di Simulator

-> _Silakan buka navigator dan pilih cerita untuk dilihat._ di Simulator
-> cerita di panel kiri di jendela browser
-> default _Selamat datang di storybook_ di panel utama di jendela browser

Apakah ini pendekatan yang benar secara umum?
Adakah pemikiran, petunjuk, ide tentang mengapa versi baru tidak bekerja untuk saya?

@ z00m1n Saya pikir issie Anda adalah bahwa Anda menjalankan kode Anda melalui terowongan di expo.

@ z00m1n juga harap tingkatkan @storybook/* menjadi 5.2.0-alpha.36 keseluruhan

@Gongreg : Cerita muncul di panel kiri dan dipilih saat saya memilihnya di UI Buku Cerita di Simulator, jadi AFAICT, konektivitas dibuat. Panel utama tetap _Welcome to storybook_; sebenarnya, saya belum pernah melihat panel utama menampilkan konten lain.
@shilman : Saya melakukan:

$ npm list --depth=0 2>&1 | grep <strong i="9">@storybook</strong>
├── @storybook/[email protected]
├── @storybook/[email protected]
├── @storybook/[email protected]
├── @storybook/[email protected]
├── @storybook/[email protected]
├── @storybook/[email protected]
├── @storybook/[email protected]

Periksa ulang, disegarkan, dimulai ulang, ditinjau. Masalahnya terus berlanjut.

(DOH!) Seharusnya memikirkan hal itu sebelumnya: Tangkapan layar di bawah ini menunjukkan apa yang saya dapatkan di konsol alat pengembang peramban untuk halaman Buku Cerita. Tidak tahu apa artinya semua itu atau apakah itu terkait, tapi mungkin itu membantu. Tidak ada keluaran lebih lanjut, tidak peduli apa yang saya klik, hanya kesalahan yang sama yang berulang:

@ z00m1n Saya mencari 2 jam untuk masalah itu. Saya akan menyalin dan menempelkan pesan kesalahan untuk membuat hidup semua orang lebih sederhana 🙂

Uncaught TypeError: Cannot read property 'toLowerCase' of undefined
    at sanitize 

Ooh-la-la !! Saya baru saja merilis https://github.com/storybookjs/storybook/releases/tag/v5.1.10 berisi PR # 7187 yang mereferensikan masalah ini. Tingkatkan versi hari ini untuk mencobanya!