Generating techdocs from the provided example doesn't work

Expected Behavior

When clicking on the READ DOCS link that is generated using this example in the Documentation, the docs are properly displayed.

Current Behavior

│ 2021-05-12T15:33:41.388Z techdocs info Step 1 of 3: Preparing docs for entity Component:default/documented-component type=plugin                                                                       │
│ 2021-05-12T15:33:41.390Z backstage info ::ffff:127.0.0.1 - - [12/May/2021:15:33:41 +0000] "GET /api/techdocs/metadata/entity/default/Component/documented-component HTTP/1.1" 200 - "-" "Mozilla/5.0 ( │
│ Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.93 Safari/537.36 Edg/90.0.818.56" type=incomingRequest                                                      │
│ 2021-05-12T15:33:45.877Z techdocs info Prepare step completed for entity Component:default/documented-component, stored at /tmp/backstage-x4IzEX type=plugin                                           │
│ 2021-05-12T15:33:45.877Z techdocs info Step 2 of 3: Generating docs for entity Component:default/documented-component type=plugin                                                                      │
│ 2021-05-12T15:33:45.887Z techdocs error Build failed with error:  type=plugin                                                                                                                          │
│ 2021-05-12T15:33:45.887Z backstage error Failed to generate docs from /tmp/backstage-x4IzEX into /tmp/techdocs-tmp-vZzFt4 with error spawn mkdocs ENOENT type=errorHandler stack=Error: Failed to gene │
│ rate docs from /tmp/backstage-x4IzEX into /tmp/techdocs-tmp-vZzFt4 with error spawn mkdocs ENOENT                                                                                                      │
│     at TechdocsGenerator.run (/app/node_modules/@backstage/techdocs-common/dist/index.cjs.js:213:13)                                                                                                   │
│     at runMicrotasks (<anonymous>)                                                                                                                                                                     │
│     at processTicksAndRejections (internal/process/task_queues.js:93:5)                                                                                                                                │
│     at async DocsBuilder.build (/app/node_modules/@backstage/plugin-techdocs-backend/dist/index.cjs.js:99:5)                                                                                           │
│     at async /app/node_modules/@backstage/plugin-techdocs-backend/dist/index.cjs.js:214:9                                                                                                              │
│ 2021-05-12T15:33:45.888Z backstage info ::ffff:127.0.0.1 - - [12/May/2021:15:33:45 +0000] "GET /api/techdocs/sync/default/Component/documented-component HTTP/1.1" 500 311 "-" "Mozilla/5.0 (Macintosh │
│ ; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.93 Safari/537.36 Edg/90.0.818.56" type=incomingRequest

Content from both mentioned directories /tmp/backstage-x4IzEX

total 20
drwxrwxr-x 3 root root 4096 May 12 15:33 .
drwxrwxrwt 1 root root 4096 May 12 15:33 ..
-rw-r--r-- 1 root root  368 May 12 10:54 catalog-info.yaml
drwxrwxr-x 4 root root 4096 May 12 15:33 docs
-rw-r--r-- 1 root root  176 May 12 15:33 mkdocs.yml

/tmp/techdocs-tmp-vZzFt4

total 8
drwx------ 2 root root 4096 May 12 15:33 .
drwxrwxrwt 1 root root 4096 May 12 15:33 ..

Possible Solution

Steps to Reproduce

1. Create the app using yarn backstage-create-app
2. Add default example to the locations in app-config.yaml:

    - type: url
      target: https://github.com/backstage/backstage/blob/master/plugins/techdocs-backend/examples/documented-component/catalog-info.yaml

1. Use local setup:

techdocs:
  builder: 'local' # Alternatives - 'external'
  generators:
    techdocs: 'local' # Alternatives - 'docker'
  publisher:
    type: 'local' # Alternatives - 'googleGcs' or 'awsS3' or 'azureBlobStorage' or 'openStackSwift'. Read documentation for using alternatives.

1. Build docker image and start it.

Context

See above.

Your Environment

• NodeJS Version (v12): v14
• Operating System and Version (e.g. Ubuntu 14.04): using default Dockerfile, image running on AKS
• Used master branch for building, latest commit https://github.com/backstage/backstage/commit/f3f09dda341ff21fc1d55d088ee6698a638feb93

[OrkoHunter]

Looking at the error - error spawn mkdocs ENOENT, it could be that your Docker instance is missing mkdocs. This should help

https://github.com/backstage/techdocs-container/blob/5322712e95f654efe9194517a81347f53932681b/Dockerfile#L23

[OrkoHunter]

@nadworny Oh yeah - please create a new issue, thanks! Looks like a bug with the URL Reader that is downloading the tree from Azure DevOps. Please also add how the backstage.io/techdocs-ref metadata annotation looks like in the entity’s catalog-info.yaml.