Search code examples
dockerdockerfileapache-superset

How does one overwrite a superset javascript file with Docker?


When I use the COPY command in my Dockerfile to overwrite a particular file (in this case I'm trying to change the alert in the SQLAlchemy Editor when it gets saved, just one of the changes I want to perform), the change is visible in the code and the docker container shell, but is not displayed when I run the code.

In the docker file I have added the copy command line, before the RUN command which was already in our dockerfile.

...
COPY actions.js /usr/local/lib/python3.6/site-packages/superset/static/assets/src/SqlLab/actions.js
RUN chmod +x /superset-init.sh

The file itself that I am trying to copy across is placed in the same directory as the Dockerfile as is required and the following changes are made (not extensive, this is just to pick up that the changes are actually being processed)

Before:

export function saveQuery(query) {
  const url = '/savedqueryviewapi/api/create';
  $.ajax({
    type: 'POST',
    url,
    data: query,
    success: () => notify.success(t('Your query was saved')),
    error: () => notify.error(t('Your query could not be saved')),
    dataType: 'json',
  });
  return { type: SAVE_QUERY };
}

After:

export function saveQuery(query) {
  const url = '/savedqueryviewapi/api/create';
  $.ajax({
    type: 'POST',
    url,
    data: query,
    success: () => notify.success(t('Your query was saved and stored')),
    error: () => notify.error(t('Your query could not be saved')),
    dataType: 'json',
  });
  return { type: SAVE_QUERY };
}

As mentioned I've tried to copy the code over using the docker COPY command, but this has not worked. It worked when copying over standard HTML files, but not these JS files.

COPY COMMAND

COPY actions.js /usr/local/lib/python3.6/site-packages/superset/static/assets/src/SqlLab/actions.js

If this works the alert should change and any other changes I make to the JS functions should be visible.

UPDATE

The solution may lie in adding nvm, node and npm to my dockerfile, so that changes to my Javascript files are watched.


Solution

  • Adding the following lines to my Dockerfile brought the changes through to the frontend.

    RUN apt-get update && apt-get install -y \
      nano \
      curl \
    ...
    # Install nodejs for custom build
    # https://superset.incubator.apache.org/installation.html#making-your-own-build
    # https://nodejs.org/en/download/package-manager/
    
    RUN curl -sL https://deb.nodesource.com/setup_10.x | bash - \
        && apt-get install -y nodejs
    
    RUN cd ../usr/local/lib/python3.6/site-packages/superset/static/assets \
        && npm install \
        && npm ci \
        && npm run build \
        && rm -rf node_modules
    
    

    As I understand, the issue was that the changes to my frontend were not being compiled. Add these lines in the build compiles the changes made to the JS or JSX files.

    I added these additions by looking at the Dockerfile here: https://github.com/apache/incubator-superset/blob/master/contrib/docker/Dockerfile

    I also had to add the package.json file, because the one that was present had invalid package lines.

    COPY package.json /usr/local/lib/python3.6/site-packages/superset/static/assets/package.json