Angular Nx Storybook with Storybook Docs for Angular addon throwing error ./tsconfig.json not found - angular-storybook

I have developed an angular library using Nx and i am trying to create documentation using this add on for storybook
https://github.com/storybookjs/storybook/blob/next/addons/docs/angular/README.md
i have added addon like this to my main.js file under .storybook folder
module.exports = {
addons: ['#storybook/addon-docs'],
};
i have installed #compodoc/compodoc and i have added following section to package.json file
{
...
"scripts": {
"docs:json": "compodoc -p ./tsconfig.json -e json -d .",
"storybook": "npm run docs:json && start-storybook -p 6006 -s src/assets",
...
},
}
I added following section to .storybook/preview.js file as well
import { setCompodocJson } from '#storybook/addon-docs/angular';
import docJson from '../documentation.json';
setCompodocJson(docJson);
Once i do
npm run storybook it gives me following error
"./tsconfig.json" file was not found in the current directory
Failed at the docs:json script.

ok finally i found the issue the path should be as follows:
it should be ../../../tsconfig.json instead of ./tsconfig.json
basically . points to the folder where your preview.js is.
{
...
"scripts": {
"docs:json": "compodoc -p ../../../tsconfig.json -e json -d .",
"storybook": "npm run docs:json && start-storybook -p 6006 -s src/assets",
...
},
}

Related

Combined JSON & Mochawesome test report not generating during Cypress tests in Docker container?

I am running Cypress tests inside a Docker container to generate a HTML test report.
Here is my folder structure:
As you can see in the cypress/reports/mocha folder, there are some JSON test results generated.
All tests are passing & the 3 JSON files there are populated.
Also, notice the empty cypress/reports/mochareports folder. This should contain the combined JSON of all test results, & a HTML test report.
Here is my package.json:
{
"name": "cypress-docker",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
"clean:reports": "mkdir -p cypress/reports && rm -R -f cypress/reports/* && mkdir cypress/reports/mochareports",
"pretest": "npm run clean:reports",
"scripts": "cypress run",
"chrome:scripts": "cypress run --browser chrome ",
"firefox:scripts": "cypress run --browser firefox ",
"combine-reports": "mochawesome-merge cypress/reports/mocha/*.json > cypress/reports/mochareports/report.json",
"generate-report": "marge cypress/reports/mochareports/report.json -f report -o cypress/reports/mochareports",
"posttest": "npm run combine-reports && npm run generate-report",
"test": "npm run scripts || npm run posttest",
"chrome:test": "npm run pretest && npm run chrome:scripts || npm run posttest",
"firefox:test": "npm run pretest && npm run firefox:scripts || npm run posttest"
},
"keywords": [],
"author": "QA BOX <qabox#gmail.com>",
"license": "MIT",
"dependencies": {
"cypress": "^6.8.0",
"cypress-multi-reporters": "^1.4.0",
"mocha": "^8.2.1",
"mochawesome": "^6.2.1",
"mochawesome-merge": "^4.2.0",
"mochawesome-report-generator": "^5.1.0"
}
}
Here is my cypress.json:
{
"reporter": "cypress-multi-reporters",
"reporterOptions": {
"reporterEnabled": "mochawesome",
"mochawesomeReporterOptions": {
"reportDir": "cypress/reports/mocha",
"quite": true,
"overwrite": false,
"html": false,
"json": true
}
}
}
Here are the commands I use to run the tests:
To build the image - docker build -t cyp-dock-mocha-report .
docker-compose run e2e-chrome
Here is my Dockerfile:
FROM cypress/included:6.8.0
RUN mkdir /cypress-docker
WORKDIR /cypress-docker
COPY ./package.json .
COPY ./package-lock.json .
COPY ./cypress.json .
COPY ./cypress ./cypress
RUN npm install
ENTRYPOINT ["npm", "run"]
Here is my docker-compose.yml:
version: "3"
services:
# this container will run Cypress test using built-in Electron browser
e2e-electron:
image: "cyp-dock-mocha-report"
command: "test"
volumes:
- ./cypress/videos:/cypress-docker/cypress/videos
- ./cypress/reports:/cypress-docker/cypress/reports
# this container will run Cypress test using Chrome browser
e2e-chrome:
image: "cyp-dock-mocha-report"
command: "chrome:test"
volumes:
- ./cypress/videos:/cypress-docker/cypress/videos
- ./cypress/reports:/cypress-docker/cypress/reports
# this container will run Cypress test using Firefox browser
# note that both Chrome and Firefox browsers were pre-installed in the Docker image
e2e-firefox:
image: "cyp-dock-mocha-report"
command: "firefox:test"
# if you want to debug FF run, pass DEBUG variable like
environment:
- DEBUG=cypress:server:browsers:firefox-util,cypress:server:util:process_profiler
volumes:
- ./cypress/videos:/cypress-docker/cypress/videos
- ./cypress/reports:/cypress-docker/cypress/reports
All tests are passing as you can see below:
I don't know why the Mochawesome HTML test report isn't generating, or the merged JSO
Can someone please tell me why the merged JSON & the HTML test report aren't being generated in mochareports folder, & how I can get them to?
thanks for giving me a hint on how to use docker compose with this image! I think I see where the issue is: in the package.json file, under scripts, instead of "merge", you wrote "marge":
"generate-report": "marge cypress/reports/mochareports/report.json -f report -o cypress/reports/mochareports"

Mocha --watch with Docker

I'm trying to use --watch on mocha but when I save code source or test source, it doesn't re run tests. I have an enviroment using docker-compose with node:16-slim image and my tests run inside it. This same config works with bare metal enviroment.
The dev docker image run the app with:
USER node
CMD ["npm", "run", "dev"]
And this npm script is:
"dev": "npx nodemon --inspect=0.0.0.0:1080 src/index.js",
test npm script:
"test:tdd": "cross-env NODE_ENV=test mocha --config .mocharc.tdd.js",
.mocharc.tdd.js:
module.exports = {
"reporter": "dot",
"watch": true,
"watch-ignore": [],
"file": 'test/common.js',
"recursive": true
};
output:
> test-app#1.0.0 test:tdd
> cross-env NODE_ENV=test mocha --config .mocharc.tdd.js
!
0 passing (6ms)
1 failing
1) Events
abc:
MissingParamError: Missing param: Data
at updated (src/app/events.js:8:22)
at Context.<anonymous> (test/app/events.test.js:13:28)
ℹ [mocha] waiting for changes...
Versions:
➜ test-app git:(master) ✗ npx mocha --version
10.0.0
➜ test-app git:(master) ✗ node --version
v16.15.0
➜ test-app git:(master) ✗ npx nodemon --version
2.0.15
What can I do to fix this? Thanks in advance =)
I solved it. I added watch-files attr to config file.
mocharc.tdd.js:
module.exports = {
"reporter": "dot",
"watch": true,
"watch-files": ['test/**/*.js', 'src/**/*.js'],
"watch-ignore": ['node_modules'],
"file": 'test/common.js',
"recursive": true
};

How do I get a Command to run from a Dockerfile.aws.json on Elastic Beanstalk?

I have a Dockerfile and a Dockerfile.aws.json:
{
"AWSEBDockerrunVersion": "1",
"Ports": [{
"ContainerPort": "5000",
"HostPort": "5000"
}],
"Volumes": [{
"HostDirectory": "/tmp/download/models",
"ContainerDirectory": "/models"
}],
"Logging": "/var/log/nginx",
"Command": "mkdir -p /tmp && axel https://example.com/models.zip -o /tmp/models.zip"
}
But when I deploy, it doesn't run the Command that I specified. What am I doing wrong?
If you have ENTRYPOINT in your Dockerfile, than the Command gets appended as its arguments:
Specify a command to execute in the container. If you specify an Entrypoint, then Command is added as an argument to Entrypoint. For more information, see CMD in the Docker documentation.
Thus your Command mkdir -p /tmp ... will be used as an argument to python3 -m flask run --host=0.0.0.0, resulting in error. This could explain why you experience issue.
I tried to recreate the issue initially using your Command structure but had some problems. What worked was using Command in the following way:
"Command": "/bin/bash -c \"mkdir -p /tmp && axel https://example.com/models.zip -o /tmp/models.zip\""
My Dockerfile did not have Entrypoint. Thus to run your python you could maybe do the following (assuming everything else is correct):
"Command": "/bin/bash -c \"mkdir -p /tmp && axel https://example.com/models.zip -o /tmp/models.zip && python3 -m flask run --host=0.0.0.0\""
Do you have the Dockerfile content?
It most likely they your ENTRYPOINT script does not receive parameters, or it is ignoring it.
What you can do is something similar to this.
You have an entrypoint script that receive the command passed in aws.json as parameter, execute it and then call your real python command.
Or you can replace your ENTRYPOINT by something similar to this:
ENTRYPOINT ["/bin/bash"]
and your default command will be:
CMD ["python3 ..."]
This way when running locally you only run the python3 command.
When running in aws, you can change your Command and append the python to the end, as mentioned by Marcin. Both cases works

Visual Studio Code Remote - Containers - change shell

When launching an attached container in "VS Code Remote Development", has anyone found a way to change the container's shell when launching the vscode integrated terminal.
It seems to run something similar to.
docker exec -it <containername> /bin/bash
I am looking for the equivalent of
docker exec -it <containername> /bin/zsh
The only settings I found for Attached containers are
"remote.containers.defaultExtensions": []
I worked around it with
RUN echo "if [ -t 1 ]; then" >> /root/.bashrc
RUN echo "exec zsh" >> /root/.bashrc
RUN echo "fi" >> /root/.bashrc
Still would be interested in knowing if there was a way to set this per container.
I use a Docker container for my development environment and set the shell to bash in my Dockerfile:
# …
ENTRYPOINT ["bash"]
Yet when VS Code was connecting to my container it was insisting on using the /bin/ash shell which was driving me crazy... However the fix (at least for me) was very simple but not obvious:
From the .devcontainer.json reference.
All I needed to do in my case was to add the following entry in my .devcontainer.json file:
{
…
"settings": {
"terminal.integrated.shell.*": "/bin/bash"
}
…
}
Complete .devcontainer.json file (FYI)
{
"name": "project-blueprint",
"dockerComposeFile": "./docker-compose.yml",
"service": "dev",
"workspaceFolder": "/workspace/dev",
"postCreateCommand": "yarn",
"settings": {
"terminal.integrated.shell.*": "/bin/bash"
}
}
I'd like to contribute to this thread since I spent a decent amount of time combing the web for a good solution to this involving VS Code's new API for terminal.integrated.profiles.linux
Note as of 20 Jan 2022 both the commented and the uncommented json work. The uncommented out lines is the new non deprecated way to get this working with Dev containers.
{
"settings": {
// "terminal.integrated.shell.linux": "/bin/zsh"
"terminal.integrated.defaultProfile.linux": "zsh",
"terminal.integrated.profiles.linux": {
"zsh": {
"path": "/bin/zsh"
},
}
}
}
if any one is interested I also figured out how to get oh my ZSH built into the image.
Dockerfile:
# Setup Stage - set up the ZSH environment for optimal developer experience
FROM node:16-alpine AS setup
RUN npm install -g expo-cli
# Let scripts know we're running in Docker (useful for containerized development)
ENV RUNNING_IN_DOCKER true
# Use the unprivileged `node` user (pre-created by the Node image) for safety (and because it has permission to install modules)
RUN mkdir -p /app \
&& chown -R node:node /app
# Set up ZSH and our preferred terminal environment for containers
RUN apk --no-cache add zsh curl git
# Set up ZSH as the unprivileged user (we just need to start it, it'll initialize our setup itself)
USER node
# set up oh my zsh
RUN cd ~ && wget https://raw.githubusercontent.com/ohmyzsh/ohmyzsh/master/tools/install.sh && sh install.sh
# initialize ZSH
RUN /bin/zsh ~/.zshrc
# Switch back to root
USER root

How to workaround "the input device is not a TTY" when using grunt-shell to invoke a script that calls docker run?

When issuing grunt shell:test, I'm getting warning "the input device is not a TTY" & don't want to have to use -f:
$ grunt shell:test
Running "shell:test" (shell) task
the input device is not a TTY
Warning: Command failed: /bin/sh -c ./run.sh npm test
the input device is not a TTY
Use --force to continue.
Aborted due to warnings.
Here's the Gruntfile.js command:
shell: {
test: {
command: './run.sh npm test'
}
Here's run.sh:
#!/bin/sh
# should use the latest available image to validate, but not LATEST
if [ -f .env ]; then
RUN_ENV_FILE='--env-file .env'
fi
docker run $RUN_ENV_FILE -it --rm --user node -v "$PWD":/app -w /app yaktor/node:0.39.0 $#
Here's the relevant package.json scripts with command test:
"scripts": {
"test": "mocha --color=true -R spec test/*.test.js && npm run lint"
}
How can I get grunt to make docker happy with a TTY? Executing ./run.sh npm test outside of grunt works fine:
$ ./run.sh npm test
> yaktor#0.59.2-pre.0 test /app
> mocha --color=true -R spec test/*.test.js && npm run lint
[snip]
105 passing (3s)
> yaktor#0.59.2-pre.0 lint /app
> standard --verbose
Remove the -t from the docker run command:
docker run $RUN_ENV_FILE -i --rm --user node -v "$PWD":/app -w /app yaktor/node:0.39.0 $#
The -t tells docker to configure the tty, which won't work if you don't have a tty and try to attach to the container (default when you don't do a -d).
This solved an annoying issue for me. The script had these lines:
docker exec **-it** $( docker ps | grep mysql | cut -d' ' -f1) mysql --user= ..... > /var/tmp/temp.file
mutt -s "File is here" someone#somewhere.com < /var/tmp/temp.file
The script would run great if run directly and the mail would come with the correct output. However, when run from cron, (crontab -e) the mail would come with no content. Tried many things around permissions and shells and paths etc. However no joy!
Finally found this:
*/20 * * * * scriptblah.sh > $HOME/cron.log 2>&1
And on that cron.log file found this output:
the input device is not a TTY
Search led me here. And after I removed the -t, it's working great now!
docker exec **-i** $( docker ps | grep mysql | cut -d' ' -f1) mysql --user= ..... > /var/tmp/temp.file

Resources