gatsby-uc / gatsby-uc/plugins

bug(gatsby-source-strapi): Cannot read properties of undefined (reading 'split')

Open
#383 8 comments 0 reactions 0 assignees View on GitHub
documentation
Dominant language
JavaScript
Stars
57
Forks
37
PR merge metrics
No merged PRs in 30d

Description

## Describe the bug
When `gatsby build`, the error "Cannot read properties of undefined (reading 'split')" is raised. After investigating, I have narrowed down the issue to the following content type schema:

- `User` content type (from permission-user plugin) has a one-to-one relationship with the `Editor` content type.
- `Post` content type has a belongs-to relationship with the `Editor` content type.
- `Editor` content type has a richtext field called `bio`.

The issue arises when the `bio` field in the `User` content type's `editor` relation is in string format, while the plugin expects it to be in richtext object format.

See these source codes, in the setting above it would be equivalent to `extraftFiles(undefined, apiURL)`, then it causes the error.
``` javascript
if (type === "richtext") {
const extractedFiles = extractFiles(value.data, apiURL);
```

Noted that the `bio` field in the `Post` content type's `editor` relation is in the correct richtext object format with the following structure:
``` javascript
{
data: string,
medias: Media[],
}
```

## Proof of Concept

I've added several log lines inside the function `download-media-files.extractImages()`.

### Part 1
``` javascript
if (value && type) {
// Start of log code.
if (attributeName === "bio") {
console.log("[uid]", uid, "[type]", type, "[value]", value);
}
// End of log code.
if (type === "richtext") {
...
```

### Part 2
``` javascript
if (type === "relation") {
// Start of log code.
console.log("", "[uid]", uid, "[value]", value, "[target]", attribute.target);
// End of log code.
await extractImages(value, context, attribute.target);
}
```

### The log
The log is as follow, omitting unimportant parts.

```
[uid] api::post.post [value] {
bio: {
data: "**Chia-Sheng** is an experienced engineer with a strong background in .NET related technologies, including C#
and Azure. He is proficient in React.js and previously worked with Ruby on Rails. While he's not coding, **Chia-Sheng**
enjoys traveling and playing football.",
medias: []
},
} [target] api::editor.editor

[uid] api::editor.editor [type] richtext [value] {
data: "**Chia-Sheng** is an experienced engineer with a strong background in .NET related technologies, including C#
and Azure. He is proficient in React.js and previously worked with Ruby on Rails. While he's not coding, **Chia-Sheng**
enjoys traveling and playing football.",
medias: []
}

[uid] plugin::users-permissions.user [value] {
bio: "**Chia-Sheng** is an experienced engineer with a strong background in .NET related technologies, including C#
and Azure. He is proficient in React.js and previously worked with Ruby on Rails. While he's not coding, **Chia-Sheng**
enjoys traveling and playing football.",
} [target] api::editor.editor

[uid] api::editor.editor [type] richtext [value] **Chia-Sheng** is an experienced engineer with a strong background in
.NET related technologies, including C# and Azure. He is proficient in React.js and previously worked with Ruby on
Rails. While he's not coding, **Chia-Sheng** enjoys traveling and playing football.
```

In the log, we see that the value for the `api::post.post` relationship is an object with a `bio` property, where the `bio` property is itself an object with a `data` property and a `medias` property. The `data` property contains a string value with some biographical information about a person.

On the other hand, the value for the `plugin::users-permissions.user` relationship is a string containing the same biographical information as the `data` property in the first schema.

## System Info

https://github.com/cschenio/blog

## Error Log

This is the log for `yarn run build --verbose`.

```
ERROR #11321 API.NODE.EXECUTION

"gatsby-source-strapi" threw an error while running the sourceNodes lifecycle:

Cannot read properties of undefined (reading 'split')

TypeError: Cannot read properties of undefined (reading 'split')

- commonmark.js:9623 Object.parse
[gatsby]/[commonmark]/dist/commonmark.js:9623:27

- download-media-files.js:22 extractFiles
[gatsby]/[gatsby-source-strapi]/dist/download-media-files.js:22:25

- download-media-files.js:135 extractImages
[gatsby]/[gatsby-source-strapi]/dist/download-media-files.js:135:32

- download-media-files.js:186 extractImages
[gatsby]/[gatsby-source-strapi]/dist/download-media-files.js:186:15

- download-media-files.js:215
[gatsby]/[gatsby-source-strapi]/dist/download-media-files.js:215:3

- async Promise.all

not finished source and transform nodes - 4.688s

error Command failed with exit code 1.
```

Contributor guide

Open the contributing guide

Research direction

Start in download-media-files.js at extractFiles and extractImages, then reproduce the reported schema with the linked blog project or equivalent User, Editor, and Post relations. Trace how the richtext value is passed into commonmark parsing, and consider the issue done when the Gatsby build completes without the split error while preserving the valid Post relation behavior.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript
Domain
data
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
38/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.