Giter Club home page Giter Club logo

henriqueinonhe / promises-training Goto Github PK

View Code? Open in Web Editor NEW
758.0 5.0 29.0 1.57 MB

Practice working with promises through a curated collection of interactive challenges. This repository provides a platform to refine your skills, complete with automated tests to to give you instant feedback and validate your progress.

License: Other

TypeScript 96.63% JavaScript 2.50% HTML 0.14% SCSS 0.73%
async async-await promises exercises practice

promises-training's Issues

Error initializing graph exercises tests data

Fresh install. Windows 10, node v18.15.0. For some reason script tried to navigate to 'D:\D:\work\promises\.data\graph which is obviously an incorrect path.

Initializing graph exercises tests data...

> [email protected] graph:generateTests
> ts-node ./scripts/generateGraphTestsData.ts

[Error: ENOENT: no such file or directory, mkdir 'D:\D:\work\promises\.data\graph'] {
  errno: -4058,
  code: 'ENOENT',
  syscall: 'mkdir',
  path: 'D:\\D:\\work\\promises\\.data\\graph'
}

Error initializing graph exercises tests data
Error: Command failed: npm run graph:generateTests
    at checkExecSyncError (node:child_process:885:11)
    at execSync (node:child_process:957:15)
    at run (C:\Users\Uliss\AppData\Local\npm-cache\_npx\117e15c697a42bb1\node_modules\create-promises-training\bin.cjs:19:3)
    at initializeGraphTestsData (C:\Users\Uliss\AppData\Local\npm-cache\_npx\117e15c697a42bb1\node_modules\create-promises-training\bin.cjs:155:5)
    at setup (C:\Users\Uliss\AppData\Local\npm-cache\_npx\117e15c697a42bb1\node_modules\create-promises-training\bin.cjs:45:9)
    at async main (C:\Users\Uliss\AppData\Local\npm-cache\_npx\117e15c697a42bb1\node_modules\create-promises-training\bin.cjs:32:3) {
  status: 1,
  output: [ null, null, null ],
  pid: 12484,
  stderr: null
}
npm notice
npm notice New major version of npm available! 9.5.0 -> 10.2.4
npm notice Changelog: https://github.com/npm/cli/releases/tag/v10.2.4
npm notice Run npm install -g [email protected] to update!
npm notice
npm ERR! code 1
npm ERR! path D:\work\promises
npm ERR! command failed
npm ERR! command C:\Windows\system32\cmd.exe /d /s /c create-promises-training

npm ERR! A complete log of this run can be found in:
npm ERR!     C:\Users\Uliss\AppData\Local\npm-cache\_logs\2023-11-24T10_54_16_816Z-debug-0.log

2023-11-24T10_54_16_816Z-debug-0.log

'queueMicrotask' shouldn't be the only way the foundation/promise tests pass

The only way the tests pass while the onFulfilled and onRejected functions are not invoked synchronously is when the onFulfilled and onRejected functions are delayed specifically with queueMicrotask.

While the linked spec for the exercise doesn't specifically mention queueMicrotask instead it mentions: setTimeout, setImmediate, proccess.nextTick which by the spec are valid ways of making sure onFulfilled and onRejected are not called synchronously:
https://promisesaplus.com/#point-67:~:text=Here%20%E2%80%9Cplatform%20code,handlers%20are%20called.

await waitForPromises();
const nextPromise = promise.then(onFulfilled, onRejected);

it("`.then` onFulfilled gets called with resolved value", async () => {
const { onFulfilled, resolvedValue } = await thirdSetup();
expect(onFulfilled).toHaveBeenCalledTimes(1);
expect(onFulfilled).toHaveBeenCalledWith(resolvedValue);
});

Improve Graph Exercises UI

The graph exercises UI (npm run graph:ui) has a very basic styling and looks very ugly.

It would be nice to have it look better and be easier to work with.

Improve `promiseAll` and `promiseAllSettled` tests

Currently, tests for both promiseAll and promiseAllSettled only check for a specific resolution order for promises and for a single promise list length.

One of the problems that this causes, for example, for the promiseAll exercise is that there is a false negative (test passes but implementation is faulty) for the following implementation:

export default async <T>(promises: Array<Promise<T>>): Promise<Array<T>> => {
  const promiseCount = promises.length;
  const resolvedValues: Array<T> = [];

  return new Promise((resolve, reject) => {
    promises.forEach((promise, index) => {
      promise.then((result) => {
        resolvedValues[index] = result;

        if (resolvedValues.length === promisesCount) {
          resolve(resolvedValues);
        }
      }, reject);
    });
  });
};

In this case, if the last promise is not the last one to be resolved, the outer promise will resolve because when you do array[index] = something, the array is considered to have length === index + 1 for it backfills all elements before the one you're setting with undefined.

Moving forward, we want to do two things:

  1. Create tests for different lengths of promise lists, including an empty list.
  2. For each promise list, we want to exercise all possible orders (permutations) of promise resolution.

Make Migration Process More Robust

We want to make migrating to newer versions of this project as easy as possible, and to do that we have a migration script so that users can just run a command and have their projects automatically migrated to the most recent version.

Currently, the migration script (implemented in bin.cjs) is deceptively simple, and does the following:

  • Checks whether the current folder is actually a promises-training repo
  • Copies new files
  • Reinstalls dependencies

The "copies new files" step is the most sensitive one, as we want to update all "internal" files, like the ones inside src/lib, src/tests, but we want to leave existing files under src/execises untouched, as we don't want to erase users's solutions.

This migration script works in a very naive way as it doesn't consider that different versions might need different migration strategies.

Moving forward we want to use a migration approach that's similar to how database migrations work, where every time we have a new version we'll also have a migration that takes care of the specific migration between the previous and the current version, this way we only need to apply migrations in sequence and each migration can be independent of previous ones.

To do that we need:

  • A set of helpers to address common migration tasks, like copying specific files, merging old and new dependencies (because users might have installed their own dependencies so we can't just overwrite them), etc
  • An "orchestrator" that will be responsible for identifying which migrations need to be run according to the current version of the user's repo and the existing migrations

Make It Clear That Injected Stuff Must Be Used (e.g. `now`)

Some exercises require the use of things like setTimeout and now, and, in order for the tests to work correctly, users MUST use the implementations that are provided as arguments in the exercise's implementations, this way we can inject an implementation of these services that we control during tests.

We need to make it clear for users that this is the case, otherwise they might be tempted to use stuff like Date instead of now, etc, which would not be compatible with tests.

Error during installation: `TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" for /.../generateGraphTestsData.ts`

Tried install using npm create promises-training@latest

got the following error:

Initializing graph exercises tests data...

> [email protected] graph:generateTests
> ts-node ./scripts/generateGraphTestsData.ts

TypeError [ERR_UNKNOWN_FILE_EXTENSION]: Unknown file extension ".ts" for /Users/sxxxxxa/Code/promise-trainer/scripts/generateGraphTestsData.ts
    at new NodeError (node:internal/errors:405:5)
    at Object.getFileProtocolModuleFormat [as file:] (node:internal/modules/esm/get_format:99:9)
    at defaultGetFormat (node:internal/modules/esm/get_format:142:36)
    at defaultLoad (node:internal/modules/esm/load:91:20)
    at nextLoad (node:internal/modules/esm/hooks:733:28)
    at load (/Users/shxxxxa/Code/promise-trainer/node_modules/ts-node/dist/child/child-loader.js:19:122)
    at nextLoad (node:internal/modules/esm/hooks:733:28)
    at Hooks.load (node:internal/modules/esm/hooks:377:26)
    at MessagePort.handleMessage (node:internal/modules/esm/worker:168:24)
    at [nodejs.internal.kHybridDispatch] (node:internal/event_target:778:20) {
  code: 'ERR_UNKNOWN_FILE_EXTENSION'
}

Error initializing graph exercises tests data
Error: Command failed: npm run graph:generateTests
    at checkExecSyncError (node:child_process:887:11)
    at execSync (node:child_process:959:15)
    at run (/Users/shxxxxa/.npm/_npx/117e15c697a42bb1/node_modules/create-promises-training/bin.cjs:19:3)
    at initializeGraphTestsData (/Users/shxxxxa/.npm/_npx/117e15c697a42bb1/node_modules/create-promises-training/bin.cjs:155:5)
    at setup (/Users/shxxxxa/.npm/_npx/117e15c697a42bb1/node_modules/create-promises-training/bin.cjs:45:9)
    at async main (/Users/shxxxxxa/.npm/_npx/117e15c697a42bb1/node_modules/create-promises-training/bin.cjs:32:3) {
  status: 1,
  signal: null,
  output: [ null, null, null ],
  pid: 30204,
  stdout: null,
  stderr: null
}

Question: best practises

Thank you for this awesome project! Just a question: Will best practices or solutions be added eventually? Discussions might be a perfect place for such a thing.

E2E Tests

This package has a lot of setup involved, a lot of things can go wrong during this setup.

We want to have some way of running E2E tests before publishing a new version so that we can make sure that:

  • Installation/setup works properly when using npm create promises-training@latest
  • Migrations work properly

It's very easy to mess up setup/installation/migrations in a way that you'll only notice it after you have published, and then you have to do a bunch of commits to master to get things right and you end up with a bunch of unusable versions, really annoying.

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo 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.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.