Skip to content

fix height in Vue SDK#881

Merged
hatemhosny merged 1 commit intodevelopfrom
fix-vue-sdk-height
Sep 24, 2025
Merged

fix height in Vue SDK#881
hatemhosny merged 1 commit intodevelopfrom
fix-vue-sdk-height

Conversation

@hatemhosny
Copy link
Copy Markdown
Collaborator

@hatemhosny hatemhosny commented Sep 24, 2025

Summary by CodeRabbit

  • Bug Fixes
    • Corrected the data-height binding in the Vue SDK to use the actual height value, ensuring the root element reflects the intended size.
    • Resolves cases where components did not resize correctly during reactive updates, improving layout stability and consistency across browsers.
    • Enhances compatibility with dynamic styling and theming by applying accurate height attributes, reducing sporadic rendering glitches when height changes.

@netlify
Copy link
Copy Markdown

netlify Bot commented Sep 24, 2025

Deploy Preview for livecodes ready!

Name Link
🔨 Latest commit 79b4a70
🔍 Latest deploy log https://app.netlify.com/projects/livecodes/deploys/68d466f4fafd7f0008f66079
😎 Deploy Preview https://deploy-preview-881--livecodes.netlify.app
📱 Preview on mobile
Toggle QR Code...

QR Code

Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify project configuration.

@coderabbitai
Copy link
Copy Markdown

coderabbitai Bot commented Sep 24, 2025

Walkthrough

Updated a Vue template in src/sdk/vue.ts to bind the root div’s data-height attribute to height.value instead of height, ensuring the DOM receives the reactive value rather than the Ref object. No other logic or exports were modified.

Changes

Cohort / File(s) Summary
Vue reactive binding adjustment
src/sdk/vue.ts
Switched data-height binding from height (Ref) to height.value (primitive), aligning the attribute with the underlying reactive value.

Estimated code review effort

🎯 2 (Simple) | ⏱️ ~10 minutes

Poem

I nudge a ref, a tiny hop,
From shell to value—plop, plop, plop!
Vue leaves rustle, bindings right,
Data-height now feather-light.
A carrot toast to tidy code—
Onward down the reactive road! 🥕✨

Pre-merge checks and finishing touches

✅ Passed checks (3 passed)
Check name Status Explanation
Description Check ✅ Passed Check skipped - CodeRabbit’s high-level summary is enabled.
Title Check ✅ Passed The title “fix height in Vue SDK” clearly and concisely summarizes the primary change of adjusting the height binding in the Vue SDK without extraneous detail or noise. It directly reflects the main update to use height.value and enables teammates to understand the purpose at a glance.
Docstring Coverage ✅ Passed No functions found in the changes. Docstring coverage check skipped.
✨ Finishing touches
  • 📝 Generate Docstrings
🧪 Generate unit tests
  • Create PR with unit tests
  • Post copyable unit tests in a comment
  • Commit unit tests in branch fix-vue-sdk-height

📜 Recent review details

Configuration used: CodeRabbit UI

Review profile: CHILL

Plan: Pro

📥 Commits

Reviewing files that changed from the base of the PR and between 1ac5860 and 79b4a70.

📒 Files selected for processing (1)
  • src/sdk/vue.ts (1 hunks)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (12)
  • GitHub Check: Redirect rules - livecodes
  • GitHub Check: Codacy Static Code Analysis
  • GitHub Check: Header rules - livecodes
  • GitHub Check: Pages changed - livecodes
  • GitHub Check: tests (18.x, 4)
  • GitHub Check: tests (18.x, 5)
  • GitHub Check: tests (18.x, 2)
  • GitHub Check: tests (18.x, 3)
  • GitHub Check: tests (18.x, 1)
  • GitHub Check: build
  • GitHub Check: build (18.x)
  • GitHub Check: build (18.x)
🔇 Additional comments (1)
src/sdk/vue.ts (1)

128-129: Correctly unwrap the ref before binding.

Binding height.value ensures the DOM receives the primitive height value rather than the ref wrapper, so the attribute now reflects prop updates as intended. Nice catch.


Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands and usage tips.

@sonarqubecloud
Copy link
Copy Markdown

@github-actions
Copy link
Copy Markdown
Contributor

Size Change: +18 B (0%)

Total Size: 956 kB

ℹ️ View Unchanged
Filename Size Change
./build/404.html 1 kB 0 B
./build/app.html 250 B 0 B
./build/index.html 2.46 kB 0 B
./build/livecodes/app.css 22.4 kB 0 B
./build/livecodes/app.js 111 kB -148 B (-0.13%)
./build/livecodes/assets.js 8.62 kB -4 B (-0.05%)
./build/livecodes/assets/noop.js 18 B 0 B
./build/livecodes/assets/templates/diagrams-starter.html 2.19 kB 0 B
./build/livecodes/backup.js 3.72 kB -1 B (-0.03%)
./build/livecodes/blockly.js 13.3 kB 0 B
./build/livecodes/broadcast.js 1.19 kB -1 B (-0.08%)
./build/livecodes/bundle-types.js 4.37 kB 0 B
./build/livecodes/code-to-image.js 9.12 kB -5 B (-0.05%)
./build/livecodes/codejar.js 17.6 kB 0 B
./build/livecodes/codemirror.js 6.33 kB 0 B
./build/livecodes/compile.page.js 2.39 kB 0 B
./build/livecodes/compile.worker.js 14.3 kB 0 B
./build/livecodes/compiler-utils.js 3.16 kB 0 B
./build/livecodes/custom-editor-utils.js 198 B 0 B
./build/livecodes/deploy.js 6.89 kB -4 B (-0.06%)
./build/livecodes/editor-settings.js 17.7 kB +11 B (+0.06%)
./build/livecodes/embed-ui.js 5.55 kB -1 B (-0.02%)
./build/livecodes/embed.js 89.4 kB 0 B
./build/livecodes/export.js 3.89 kB 0 B
./build/livecodes/firebase.js 22.7 kB 0 B
./build/livecodes/format.worker.js 13.4 kB 0 B
./build/livecodes/google-fonts.js 7.12 kB 0 B
./build/livecodes/headless.js 78.3 kB +160 B (+0.2%)
./build/livecodes/i18n-ar-language-info.json 5.23 kB 0 B
./build/livecodes/i18n-ar-translation.json 9.33 kB 0 B
./build/livecodes/i18n-de-language-info.json 5.25 kB 0 B
./build/livecodes/i18n-de-translation.json 9.44 kB 0 B
./build/livecodes/i18n-en-language-info.json 4.54 kB 0 B
./build/livecodes/i18n-en-translation.json 8.03 kB 0 B
./build/livecodes/i18n-es-language-info.json 5 kB 0 B
./build/livecodes/i18n-es-translation.json 9.17 kB 0 B
./build/livecodes/i18n-fa-language-info.json 5.35 kB 0 B
./build/livecodes/i18n-fa-translation.json 9.48 kB 0 B
./build/livecodes/i18n-fr-language-info.json 5.17 kB 0 B
./build/livecodes/i18n-fr-translation.json 9.42 kB 0 B
./build/livecodes/i18n-hi-language-info.json 5.78 kB 0 B
./build/livecodes/i18n-hi-translation.json 9.95 kB 0 B
./build/livecodes/i18n-it-language-info.json 5.04 kB 0 B
./build/livecodes/i18n-it-translation.json 9.26 kB 0 B
./build/livecodes/i18n-ja-language-info.json 5.57 kB 0 B
./build/livecodes/i18n-ja-translation.json 9.61 kB 0 B
./build/livecodes/i18n-pt-language-info.json 5.05 kB 0 B
./build/livecodes/i18n-pt-translation.json 9.35 kB 0 B
./build/livecodes/i18n-ru-language-info.json 5.56 kB 0 B
./build/livecodes/i18n-ru-translation.json 10.3 kB 0 B
./build/livecodes/i18n-ur-language-info.json 5.81 kB 0 B
./build/livecodes/i18n-ur-translation.json 9.78 kB 0 B
./build/livecodes/i18n-zh-CN-language-info.json 4.9 kB 0 B
./build/livecodes/i18n-zh-CN-translation.json 8.64 kB 0 B
./build/livecodes/i18n.js 20.2 kB +10 B (+0.05%)
./build/livecodes/import-src.js 16 kB 0 B
./build/livecodes/import.js 14.5 kB +3 B (+0.02%)
./build/livecodes/index.js 5.35 kB +1 B (+0.02%)
./build/livecodes/lang-art-template-compiler.js 1.65 kB 0 B
./build/livecodes/lang-assemblyscript-compiler.js 290 B 0 B
./build/livecodes/lang-assemblyscript-script.js 386 B 0 B
./build/livecodes/lang-astro-compiler.js 2.34 kB 0 B
./build/livecodes/lang-clio-compiler.js 1.55 kB 0 B
./build/livecodes/lang-commonlisp-script.js 123 B 0 B
./build/livecodes/lang-cpp-script.js 1.75 kB 0 B
./build/livecodes/lang-cpp-wasm-script.js 2.84 kB 0 B
./build/livecodes/lang-csharp-wasm-script.js 2.18 kB 0 B
./build/livecodes/lang-diagrams-compiler-esm.js 5.08 kB 0 B
./build/livecodes/lang-dot-compiler.js 1.66 kB 0 B
./build/livecodes/lang-ejs-compiler.js 1.63 kB 0 B
./build/livecodes/lang-eta-compiler.js 1.65 kB 0 B
./build/livecodes/lang-fennel-compiler.js 1.61 kB 0 B
./build/livecodes/lang-gleam-compiler.js 3.09 kB 0 B
./build/livecodes/lang-go-wasm-script.js 3.26 kB 0 B
./build/livecodes/lang-haml-compiler.js 1.65 kB 0 B
./build/livecodes/lang-handlebars-compiler.js 1.92 kB 0 B
./build/livecodes/lang-imba-compiler.js 147 B 0 B
./build/livecodes/lang-java-script.js 4.05 kB 0 B
./build/livecodes/lang-jinja-compiler.js 1.65 kB 0 B
./build/livecodes/lang-julia-script.js 3.3 kB 0 B
./build/livecodes/lang-liquid-compiler.js 1.68 kB 0 B
./build/livecodes/lang-lua-wasm-script.js 205 B 0 B
./build/livecodes/lang-malina-compiler.js 2.96 kB 0 B
./build/livecodes/lang-mustache-compiler.js 1.65 kB 0 B
./build/livecodes/lang-nunjucks-compiler.js 1.93 kB 0 B
./build/livecodes/lang-perl-script.js 268 B 0 B
./build/livecodes/lang-php-wasm-script.js 347 B 0 B
./build/livecodes/lang-postgresql-compiler-esm.js 1.73 kB 0 B
./build/livecodes/lang-prolog-script.js 204 B 0 B
./build/livecodes/lang-pug-compiler.js 371 B 0 B
./build/livecodes/lang-python-wasm-script.js 1.92 kB 0 B
./build/livecodes/lang-r-script-esm.js 2.44 kB 0 B
./build/livecodes/lang-rescript-compiler-esm.js 2.16 kB 0 B
./build/livecodes/lang-rescript-formatter.js 1.52 kB 0 B
./build/livecodes/lang-riot-compiler.js 2.81 kB 0 B
./build/livecodes/lang-ruby-wasm-script.js 1.71 kB 0 B
./build/livecodes/lang-scss-compiler.js 1.71 kB 0 B
./build/livecodes/lang-solid-compiler.js 263 B 0 B
./build/livecodes/lang-sql-compiler.js 1.63 kB 0 B
./build/livecodes/lang-sql-script.js 1.96 kB 0 B
./build/livecodes/lang-svelte-compiler.js 4.69 kB 0 B
./build/livecodes/lang-tcl-script.js 1.82 kB 0 B
./build/livecodes/lang-teal-compiler.js 1.72 kB 0 B
./build/livecodes/lang-twig-compiler.js 1.64 kB 0 B
./build/livecodes/lang-vento-compiler.js 1.68 kB 0 B
./build/livecodes/lang-vue-compiler.js 6.08 kB 0 B
./build/livecodes/lang-vue2-compiler.js 3.48 kB 0 B
./build/livecodes/lang-wat-compiler.js 348 B 0 B
./build/livecodes/lang-wat-script.js 1.58 kB 0 B
./build/livecodes/language-info.js 7.71 kB -2 B (-0.03%)
./build/livecodes/monaco-lang-astro.js 947 B 0 B
./build/livecodes/monaco-lang-clio.js 639 B 0 B
./build/livecodes/monaco-lang-imba.js 7.35 kB 0 B
./build/livecodes/monaco-lang-wat.js 2.46 kB 0 B
./build/livecodes/monaco.js 10.1 kB 0 B
./build/livecodes/open.js 6.22 kB -15 B (-0.24%)
./build/livecodes/processor-lightningcss-compiler.js 1.88 kB 0 B
./build/livecodes/processor-postcss-compiler.js 2.02 kB 0 B
./build/livecodes/processor-tailwindcss-compiler.js 5.21 kB 0 B
./build/livecodes/processor-unocss-compiler.js 355 B 0 B
./build/livecodes/processor-windicss-compiler.js 450 B 0 B
./build/livecodes/quill.css 697 B 0 B
./build/livecodes/quill.js 5.74 kB 0 B
./build/livecodes/resources.js 3.43 kB +1 B (+0.03%)
./build/livecodes/result-utils.js 1.17 kB 0 B
./build/livecodes/share.js 3.81 kB +2 B (+0.05%)
./build/livecodes/snippets.js 6.04 kB +5 B (+0.08%)
./build/livecodes/sync-ui.js 3.25 kB -1 B (-0.03%)
./build/livecodes/sync.js 3.55 kB 0 B
./build/livecodes/sync.worker.js 29.7 kB 0 B
./build/livecodes/templates.js 25.4 kB 0 B
./build/sdk/livecodes.js 3.96 kB 0 B
./build/sdk/livecodes.umd.js 4.02 kB 0 B
./build/sdk/package.json 293 B 0 B
./build/sdk/react.js 4.24 kB 0 B
./build/sdk/vue.js 4.36 kB +7 B (+0.16%)

compressed-size-action

@cloudflare-workers-and-pages
Copy link
Copy Markdown

Deploying livecodes with  Cloudflare Pages  Cloudflare Pages

Latest commit: 79b4a70
Status: ✅  Deploy successful!
Preview URL: https://9fbaaaee.livecodes.pages.dev
Branch Preview URL: https://fix-vue-sdk-height.livecodes.pages.dev

View logs

@hatemhosny hatemhosny merged commit 98837f6 into develop Sep 24, 2025
21 checks passed
@hatemhosny hatemhosny deleted the fix-vue-sdk-height branch September 27, 2025 02:24
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant