General Beef 🥩 Posts

General Beef 🥩

•Created by General Beef 🥩 on 12/11/2023 in #help

Displaying a Modal

I am trying to get a minimal example of using Bootstrap Modals, and managing that modal using state. Here is routes/Index.tsx:

import { Head } from "$fresh/runtime.ts";

import Modal from "../islands/Modal.tsx";

export default function Home() {
  return (
    <>
      <Head>
        <link
          href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css"
          rel="stylesheet"
          integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN"
          crossorigin="anonymous"
        />
      </Head>
      <Modal visible={true}/>
      <script
        src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"
        integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL"
        crossorigin="anonymous"
      >
      </script>
    </>
  );
}

import { Head } from "$fresh/runtime.ts";

import Modal from "../islands/Modal.tsx";

export default function Home() {
  return (
    <>
      <Head>
        <link
          href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/css/bootstrap.min.css"
          rel="stylesheet"
          integrity="sha384-T3c6CoIi6uLrA9TneNEoa7RxnatzjcDSCmG1MXxSR1GAsXEV/Dwwykc2MPK8M2HN"
          crossorigin="anonymous"
        />
      </Head>
      <Modal visible={true}/>
      <script
        src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.2/dist/js/bootstrap.bundle.min.js"
        integrity="sha384-C6RzsynM9kWDrMNeT87bh95OGNyZPhcTNXj1NW7RuBCsyN/o0jlpcV8Qyq46cDfL"
        crossorigin="anonymous"
      >
      </script>
    </>
  );
}

And here is islands/Modal.tsx: https://paste.jlcarveth.dev/api/02dcac97-dc65-4802-ad77-81e8ac0a8de9 The modal can open and close fine. The issue is that the state of the Modal can't be controlled programatically. When I have used Bootstrap modals in the past (with React), it was as simple as adding / removing the show class from the modal. That approach no longer seems to work. So I try to hide / show the modal via the bootstrap API, which you can see me try in the onClick of that close button. But the island can't seem to access the bootstrap API. I have tried importing bootstrap via npm:bootstrap, as well as via https://esm.sh/bootstrap In short; I want to be able to toggle the Modal on and off (visible / hidden) without having to rely on the data-bs-toggle and data-bs-target HTML attributes since that prevents me from managing the modal state.

4 replies

DDeno

•Created by General Beef 🥩 on 10/19/2023 in #help

Can use the --cert flag in the command line, but not in deno.json

I am trying to run my deno program with the following command: deno run -A --cert ~/tmp/ca.crt main.ts This works fine. However, if I put this command in my deno.json, it can no longer find the certificate:

An error occurred during route handling or page rendering. Error: Failed opening CA file: No such file or directory (os error 2)

An error occurred during route handling or page rendering. Error: Failed opening CA file: No such file or directory (os error 2)

My deno.json relevant line:

"start": "deno run -A --cert=/home/jlcarveth/tmp/ca.crt --watch=static/,routes/ dev.ts"

"start": "deno run -A --cert=/home/jlcarveth/tmp/ca.crt --watch=static/,routes/ dev.ts"

So why can Deno find the cert no problem if I run the command from the CLI, but not via deno.json?

5 replies

DDeno

•Created by General Beef 🥩 on 3/22/2023 in #help

Why isn't this error caught?

Basic code example:

try {
  Deno.remove("fakefile");
} catch (err) {
  console.log("File doesn't exist...");
}

console.log("That file didn't exist");

try {
  Deno.remove("fakefile");
} catch (err) {
  console.log("File doesn't exist...");
}

console.log("That file didn't exist");

The output when you run this is the following:

❯ deno run -A delete.js
That file didn't exist
error: Uncaught (in promise) NotFound: No such file or directory (os error 2), remove 'fakefile'
    at async Object.remove (ext:deno_fs/30_fs.js:175:3)

❯ deno run -A delete.js
That file didn't exist
error: Uncaught (in promise) NotFound: No such file or directory (os error 2), remove 'fakefile'
    at async Object.remove (ext:deno_fs/30_fs.js:175:3)

So the code within the catch statement isn't running, but the code after the catch statement is executed. And yet the program crashes due to an uncaught error.

8 replies

DDeno

•Created by General Beef 🥩 on 3/14/2023 in #help

Why am I getting an "Uncaught DOM Exception" in the Deno CLI?

To replicate: 1. deno in the command line to initialize a Deno REPL

// Get an array of random bytes
const arr = new Uint8Array(32)
crypto.getRandomValues(arr)

const decoder = new TextDecoder("utf8")
btoa(decoder.decode(arr));
> Uncaught DOMException

// Get an array of random bytes
const arr = new Uint8Array(32)
crypto.getRandomValues(arr)

const decoder = new TextDecoder("utf8")
btoa(decoder.decode(arr));
> Uncaught DOMException

The goal was to get a base64 encoding of the byte array. What am I doing wrong? atob produces the same result.

2 replies