Not restarting when making changes to .graphql files

[puchm]

I am trying to get this to watch for changes inside my .graphql files. This is the command I tried:

babel-watch --watch SCHEMA_FOLDER --extensions .ts,.graphql src/main.ts

I also tried a few of the other options but didn't succeed with that either - including running the command with polling.
What happens is that the watcher runs and it restarts when I make changes to any of the .ts files that have been imported by the entrypoint, but it doesn't restart when I make changes to my GraphQL files.

I think what is happening is that the watcher is only watching files that have been imported from the main file. However, the schema is not imported using an import statement but actually it is using a function from another package which just gets supplied with the file path - it looks like this:

import { join } from 'path';
import { loadSchemaSync } from '@graphql-tools/load';
import { GraphQLFileLoader } from '@graphql-tools/graphql-file-loader';

const schema = loadSchemaSync(join(__dirname, '../SCHEMA_FOLDER/main.graphql'), {
    loaders: [
        new GraphQLFileLoader()
    ]
});

I think that when supplying the --watch flag, the watcher should watch two things:

• everything that is imported from the entrypoint file
• every file inside all directories specified by the --watch option (and their subdirectories) that has one of the right extensions - regardless of whether it was imported somewhere or not.

Incase you think that this is an error with my system and not the package, here is some info on my system:

• babel-watch version: I tried 7.3.0 and 7.3.1 - same result on both
• Node.js version 12.18.2
• OS: Windows 10 Home 1909 Build 18363.1316

Thank you for your help in advance!

[STRML]

I think we need to modify handleChange() to check if the watched file was in the list of directories specified by --watch. If so, it should ignore whether or not it's actually in use by the program. See this code:

babel-watch/babel-watch.js

Lines 187 to 200 in e49b220

	function handleChange(file) {
	const absoluteFile = file.startsWith('/') ? file : path.join(cwd, file);
	const isUsed = Boolean(cache[absoluteFile] || errors[absoluteFile]);
	if (isUsed) {
	delete cache[absoluteFile];
	delete errors[absoluteFile];
	changedFiles.push(file); // for logging
	// file is in use by the app, let's restart!
	debouncedRestartApp();
	}
	// File was not in use, don't restart
	debugWatcher('Change detected in file: %s. File used by program and not ignored? %s', file, isUsed);
	}

Also if you run babel-watch with DEBUG="babel-watch:*" babel-watch ... you will get more useful information.

[puchm]

I think that when supplying the --watch flag, the watcher should watch two things:

• everything that is imported from the entrypoint file
• every file inside all directories specified by the --watch option (and their subdirectories) that has one of the right extensions - regardless of whether it was imported somewhere or not.

Would you agree with me on this? I don't know what the --watch flag actually does right now - from the code it seems like it is just another way to specify a directory to watch for chokidar.

So I don't really know whether the --watch flag should be used for this but I think there should be a way to watch files that haven't been imported the usual way by specifying directories where every file should be watched.

[STRML]

I agree with those points. I'm thinking that the condition on L190 should probably be removed. If we get a change notification, we should restart, full stop.

[STRML]

@puchm Could you install from git and see if the latest commit fixes your issue?

[puchm]

@STRML yes, it works! thank you.

[STRML]

Published in 7.4.0.